@charset "UTF-8";

/*-------------------------
__style
-------------------------*/

.demo{
    width: 980px;
    margin: 0 auto;}

/*=========================*/

#main .basic_sub_title{text-align: center;}
#main .basic_sub_title h2{ font-size: 3em!important; position: relative!important; display: inline-block!important; padding: 0 55px!important; background-color: #fff!important; color:#00349f!important; margin: 30px 0!important;}
#main .basic_sub_title h2:before,
#main .basic_sub_title h2:after{content: ''; position: absolute; top: 50%; display: inline-block; width: 45px; height: 2px; background-color: #00349f;}
#main .basic_sub_title h2:before{left:0;}
#main .basic_sub_title h2:after{right: 0;}

.mincyo_pic{ text-align: center; margin: 0 0 40px;}
.mincyo_pic img{ max-width: 100%; height: auto;}

h3{ color: #fff; background-color: #00349f; font-size: 1.9em; line-height: 1.2em; padding: 17px 15px 15px; margin: 0 0 20px 0;}
h4{ font-size: 2em; line-height: 1.4em; color: #00349f; font-weight: 700; margin-bottom: 10px;}

.first{ margin-bottom: 20px;}
.first p{ font-size: 1.4em; line-height: 1.8em;}
.first ul{ margin: 10px auto;}
.first ul li{ font-size: 1.4em; line-height: 1.8em; color: #00349f; font-weight:700;}
.staff_mini{ border: 4px solid #e0f0fc; padding: 20px; margin-bottom:40px; box-sizing: border-box;}
.staff_mini .left{ float: left; width: 100%; margin-right: -270px; padding-right: 270px; box-sizing: border-box;}
.staff_mini .left .m_title{font-size: 1.4em; line-height: 1.8em; color: #00349f; font-weight:700;}
.staff_mini .left .m_text{ font-size: 1.4em; line-height: 1.8em; }
.staff_mini .right{ float: right; width: 250px; height: 180px; overflow: hidden; position: relative;}
.staff_mini .right img{ position: absolute; top: 50%; left: 50%; -webkit-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); transform: translate(-50%, -50%); width: 100%; height: auto;}

.first .first_left{ width: 100%; height: auto; float: left; box-sizing: border-box; margin-right: -210px; padding-right: 210px;}
.first .first_right{ width: 200px; height: 200px; float: right;}
.first .first_right img{ width:100%; height: auto;}

@media screen and (max-width: 767px) {

#main .basic_sub_title h2{ font-size: 2.3em!important; margin: 15px 0!important;}
.mincyo_pic{ text-align: center; margin: 0 0 15px;}
h3{ color: #fff; background-color: #00349f; font-size: 1.6em; line-height: 1.4em; padding: 12px 12px 10px; margin: 0 0 10px 0; font-weight: 700;}
h4{ font-size: 1.5em; line-height: 1.4em; color: #00349f; font-weight: 700; margin-bottom: 10px;}
    
.first{ margin-bottom: 10px;}
.first p{ font-size: 1.3em; line-height: 1.6em;}
.first ul{ margin: 10px auto; text-align: center;}
.first ul li{ font-size: 1.4em; line-height: 1.6em; margin-bottom: 10px;}
.first ul li span{ display: block;}
.staff_mini{ border: 4px solid #e0f0fc; padding: 10px; margin-bottom:10px; box-sizing: border-box;}
.staff_mini .left{ float: none; width: 100%; margin-right:0; padding-right:0; box-sizing: border-box;}
.staff_mini .left .m_title{font-size: 1.4em; line-height: 1.6em; color: #00349f; font-weight:700;}
.staff_mini .left .m_text{ font-size: 1.3em; line-height: 1.6em; margin-bottom: 5px;}
.staff_mini .right{ float: none; width: 100%; height: 180px; overflow: hidden; position: relative;}
.staff_mini .right img{ position: absolute; top: 50%; left: 50%; -webkit-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); transform: translate(-50%, -50%); width: 100%; height: auto;}

.first .first_left{ float: none; margin: 0; padding: 0;}
.first .first_right{ float: none; text-align: center; margin: 10px auto;}
    
}

.blue_back{ background-color: #e0f0fc; padding: 20px; box-sizing:border-box; margin-bottom: 40px;}
.blue_back p{ font-size: 1.4em; line-height: 1.8em;}
.block01{}
.block01 .photo_box{ margin: 20px 0;}
.block01 .photo_box dl{
    float:left;
	margin-right:20px;
	width: 50%;
	width: calc((100% - 20px) / 2);
	width: -webkit-calc((100% - 20px) / 2);
	width: -moz-calc((100% - 20px) / 2);
	box-sizing:border-box;}
.block01 .photo_box dl:nth-child(2){ margin-right:0px;}
.block01 .photo_box dt{ width: 100%; height: 380px; margin-bottom: 10px; overflow: hidden; position: relative;}
.block01 .photo_box dt img{ width: 100%; height: auto; position: absolute; bottom:0;}
.blue_back .photo_box dd{ font-size: 1.2em; line-height: 1.5em;}
.blue_back .white_back{ padding: 15px 20px; box-sizing: border-box; background-color: #fff; font-size: 1.4em; line-height: 1.8em;}

.block02 .photo_box{ margin: 10px 0;}
.block02 .photo_box dl{
    float:left;
	margin-right:20px;
	width: 33.333333%;
	width: calc((100% - 40px) / 3);
	width: -webkit-calc((100% - 40px) / 3);
	width: -moz-calc((100% - 420px) / 3);
	box-sizing:border-box;
	margin-bottom: 10px;}
.block02 .photo_box dl:nth-child(3){ margin-right: 0;}
.block02 .photo_box dt{ width: 100%; height: 250px; overflow: hidden; position: relative;}
.block02 .photo_box dt img{ position: absolute; top: 50%; left: 50%; -webkit-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); transform: translate(-50%, -50%); width: 100%; height: auto;}

.blue_back .staff_box{ margin: 10px 0; display: flex; flex-wrap: wrap;}
.blue_back .staff_box.side03 dl{ width: calc(33.33333% - 14px); margin-right: 20px; margin-bottom: 20px;}
.blue_back .staff_box.side03 dl:nth-child(3n){ margin-right: 0;}
.blue_back .staff_box.side04 dl{ width: calc(25% - 15px); margin-right: 20px;}
.blue_back .staff_box.side04 dl:nth-child(4){ margin-right: 0;}
.blue_back .staff_box dl dt{ width: 100%; margin-bottom:10px; overflow: hidden; position: relative;}
.blue_back .staff_box.side03 dl dt{ height: 280px;}
.blue_back .staff_box.side04 dl dt{ height: 240px;}
.blue_back .staff_box dl dt img{ position: absolute; top: 50%; left: 50%; -webkit-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); transform: translate(-50%, -50%); width: 100%; height: auto; -webkit-transition: all 0.3s ease; -moz-transition: all 0.3s ease; -o-transition: all 0.3s ease; transition: all  0.3s ease;}
.blue_back .staff_box dl dt a{}
.blue_back .staff_box dl dt a:hover img{filter:alpha(opacity=80); -moz-opacity: 0.8; opacity: 0.8;}
.blue_back .staff_box dl dd p.staff_name{ font-size: 1.6em; font-weight: 700;}

@media screen and (max-width: 767px) {

.blue_back{ padding: 10px; margin-bottom: 10px;}
.blue_back p{ font-size: 1.3em; line-height: 1.6em;}
.block01 .photo_box{ margin: 10px 0;}
.block01 .photo_box dl{
    float:none;
	margin-right:0;
    margin-bottom: 10px;
	width: 100%;}
.block01 .photo_box dt{ height: 200px;}
.block01 .photo_box dt{ width: 100%; height: 280px; margin-bottom: 10px; overflow: hidden; position: relative;}
.block01 .photo_box dt img{ width: 100%; height: auto; position: absolute; bottom: 0;}
.blue_back .white_back{ padding: 10px 15px; font-size: 1.3em; line-height: 1.6em;}

.block02 .photo_box{ margin: 10px 0;}
.block02 .photo_box dl{
    float:none;
	margin-right:0;
	width: 100%;
	margin-bottom: 10px;}
.block02 .photo_box dt{ width: 100%; height: 200px; overflow: hidden; position: relative; margin-bottom: 5px;}
.block02 .photo_box dt img{ position: absolute; top: 50%; left: 50%; -webkit-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); transform: translate(-50%, -50%); width: 100%; height: auto;}

.blue_back .staff_box{ margin: 10px 0; display: block;}
.blue_back .staff_box.side03 dl{ width: 100%; margin-right: 0;}
.blue_back .staff_box.side04 dl{ width: 100%; margin-right: 0;}
.blue_back .staff_box dl{
    float:none;
	margin-right:0;
	width: 100%;
	margin-bottom: 10px;}
.blue_back .staff_box dl:nth-child(3){ margin-right: 0;}
.blue_back .staff_box dl dt{ width: 100%; margin-bottom:10px; overflow: hidden; position: relative;}
.blue_back .staff_box.side03 dl dt{ height: 280px;}
.blue_back .staff_box.side04 dl dt{ height: 280px;}
.blue_back .staff_box dl dt img{ position: absolute; top: 50%; left: 50%; -webkit-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); transform: translate(-50%, -50%); width: 100%; height: auto;}
.blue_back .staff_box dl dd p.staff_name{ font-size: 1.4em; font-weight: 700;}

}

.block06,
.block07{}
h5{ font-size: 1.8em; font-weight: 700; color:#00349f; padding: 10px; box-sizing: border-box;}
.voice{}
.voice .top{ margin-bottom: 10px;}
.voice .top .voice_com{}
.voice .voice_com .left{ width: 100%; margin-right: -310px; padding-right: 310px; box-sizing: border-box; float: left;}
.voice .voice_com .left p{ font-size: 1.4em; line-height: 1.8em;}
.voice .voice_com .right{ width: 285px; float: right;}
.voice .voice_com .right p:nth-child(1){ width: 100%; height: 200px; overflow: hidden; position: relative; text-align: center; margin-bottom:10px;}
.voice .voice_com .right p:nth-child(1) img{ position: absolute; top: 50%; left: 50%; -webkit-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); transform: translate(-50%, -50%); width: 100%; height: auto;}
.voice .voice_com .right p:nth-child(2){font-size: 1.2em; line-height: 1.5em;}
.voice .bottom{ border: 4px solid #e0f0fc; padding: 20px; box-sizing: border-box; margin-bottom: 40px;}
.voice .bottom .voice_com{}


.president{ margin-bottom: 40px;}
.president .president_com{ text-align: center; margin-bottom: 20px;}
.president .president_com img{ max-width: 100%;height:auto;}
.president .left{ width: 100%; margin-right: -310px; padding-right: 310px; box-sizing: border-box; float: left;}
.president .left p{font-size: 1.4em; line-height: 1.8em;}
.president .right{ width: 285px; float: right;}
.president .right .president_photo{width: 100%; height: 300px; overflow: hidden; position: relative; text-align: center; margin-bottom:10px;}
.president .right .president_photo img{position: absolute; top: 50%; left: 50%; -webkit-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); transform: translate(-50%, -50%); width: 100%; height: auto;}
.president .right p:nth-child(2){font-size: 1.7em; line-height: 1.8em; font-weight: 700;}
.president .right p:nth-child(3){font-size: 1.4em; line-height: 1.8em;}


.com_detail_box{ margin-bottom: 30px;}
.com_detail_box .left{ width: 350px; float: left;}
.com_detail_box .left img{ width: 100%; height: auto;}
.com_detail_box .right{ float: right; width: 100%; margin-left: -380px; padding-left: 380px; box-sizing: border-box;}
.com_detail_box .right table{ width: 100%;}
.com_detail_box .right table tr{font-size: 1.4em; line-height: 1.8em;}
.com_detail_box .right table tr th{ border-bottom: 1px solid #000; padding: 10px 0;}
.com_detail_box .right table tr td{ border-bottom: 1px solid #aaa; padding: 10px 0;}


.map{ width: 100%;}
.map iframe{ width: 100%; height: 600px;}
.map ul{ margin-top: 20px; font-size: 1.4em; line-height: 1.8em;}


@media screen and (max-width: 767px) {

h5{ font-size: 1.6em; line-height: 1.4em; padding:0 0 10px;}
.voice{}
.voice .top{ margin-bottom: 10px;}
.voice .top .voice_com{}
.voice .voice_com .left{ width: 100%; margin-right: 0; margin-bottom: 10px; padding-right: 0; box-sizing: border-box; float: none;}
.voice .voice_com .left p{ font-size: 1.3em; line-height: 1.6em;}
.voice .voice_com .right{ width: 100%; float: none;}
.voice .voice_com .right p:nth-child(1){ width: 100%; height: 200px; overflow: hidden; position: relative; text-align: center; margin-bottom:10px;}
.voice .voice_com .right p:nth-child(1) img{ position: absolute; top: 50%; left: 50%; -webkit-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); transform: translate(-50%, -50%); width: 100%; height: auto;}
.voice .voice_com .right p:nth-child(2){font-size: 1.2em; line-height: 1.5em;}
.voice .bottom{ border: 4px solid #e0f0fc; padding: 10px; box-sizing: border-box; margin-bottom: 20px;}
.voice .bottom .voice_com{}

.president{ margin-bottom: 20px;}
.president .president_com{ text-align: center; margin-bottom: 10px;}
.president .president_com img{ max-width: 100%;height:auto;}
.president .left{ width: 100%; margin-right: 0; padding-right: 0; box-sizing: border-box; float: none;}
.president .left p{font-size: 1.3em; line-height: 1.6em; margin-bottom: 10px;}
.president .right{ width: 100%; float: right;}
.president .right .president_photo{width: 100%; height: 300px; overflow: hidden; position: relative; text-align: center; margin-bottom:10px;}
.president .right .president_photo img{position: absolute; top: 50%; left: 50%; -webkit-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); transform: translate(-50%, -50%); width: 100%; height: auto;}
.president .right p:nth-child(2){font-size: 1.5em; line-height: 1.7em; font-weight: 700;}
.president .right p:nth-child(3){font-size: 1.3em; line-height: 1.6em;}

.com_detail_box{ margin-bottom: 20px;}
.com_detail_box .left{ width: 100%; float: none; margin-bottom:10px;}
.com_detail_box .left img{ width: 100%; height: auto;}
.com_detail_box .right{ float: none; width: 100%; margin-left: 0; padding-left: 0;}
.com_detail_box .right table{ width: 100%;}
.com_detail_box .right table tr{font-size: 1.3em; line-height: 1.6em;}
.com_detail_box .right table tr th{ border-bottom: none; background-color: #eee; padding: 8px 10px 5px; display: block; width: 100%; box-sizing: border-box;}
.com_detail_box .right table tr td{ border-bottom: none; padding: 5px 0; display: block; width: 100%;}
.com_detail_box .right table tr td a{ color: #00349f; font-weight: 700;}

.map{ width: 100%;}
.map iframe{ width: 100%; height: 300px;}
.map ul{ margin-top: 10px; font-size: 1.3em; line-height: 1.6em;}
    
}

.staff_box dl dt{ position: relative;}
.more_btn{ position: absolute; bottom: 10px; right: 10px; -webkit-transition: all 0.3s ease; -moz-transition: all 0.3s ease; -o-transition: all 0.3s ease; transition: all  0.3s ease;}
/*.more_btn:hover{filter:alpha(opacity=80); -moz-opacity: 0.8; opacity: 0.8;}*/
.more_btn p{
  position: relative;
  display: inline-block;
  width: 100px;
  height: 100px;
  border-radius: 50%;
  background: #00349f;}
.more_btn span{
  position: absolute;
  display: inline-block;
  left: 0;
  top: 50%;
  -webkit-transform: translateY(-50%);
  transform: translateY(-50%);
  width :100px;
  text-align:center;
  color: #fff;
font-size: 12px;
line-height: 17px;}