@charset "utf-8";
/* ------------------------------------------------------------  */

#fv { background: url(../images/company/fv.jpg?2004) center top no-repeat; background-size: cover;}

#message { padding: 120px 0 180px; position: relative;}
#message::before { content: ""; position: absolute; background: url(../images/index/bg_01.gif?2004); width: 70%; left: 0; top: 350px; height: 750px; z-index: -1;}
#message img { float: right;}
#message .box { float: left; width: 700px; padding: 100px 0 0; margin: 0 -67px 0 0;}
#message .box h3 { font-size: 30px; font-family: "ヒラギノ明朝 ProN W6", "HiraMinProN-W6", "HG明朝E", "ＭＳ Ｐ明朝", "MS PMincho", "MS 明朝", serif; margin: 0 0 60px;}
#message .box h3 span { font-family: 'Lora-Regular'; font-size: 70px; color: #00245e; display: block; font-style: italic; line-height: 120%; letter-spacing: 4px;}
#message .box p { font-size: 18px;}
#message .box p span { font-size: 22px; }

#outline { padding: 105px 0 185px;}
#outline h3.h3 { padding: 0 0 50px; }
#outline img { float: left; width: 45%; height: auto;}
#outline .con { float: left; width: 52%; padding: 0 0 0 3%;}
#outline .con table { width: 670px;}
#outline .con table tr th { font-family: "ヒラギノ明朝 ProN W6", "HiraMinProN-W6", "HG明朝E", "ＭＳ Ｐ明朝", "MS PMincho", "MS 明朝", serif; text-align: left; padding: 25px 20px;}
#outline .con table tr.color th,
#outline .con table tr.color td { background: #f9fbfd;}

#organization { padding: 0 0 60px;}
#organization h3.h3 { padding: 0 0 40px;}
#organization figure { max-width: 700px; margin: 0 auto; display: block; text-align: center;}
#organization figure img { width: 100%;}

#access { text-align: center; background: #f9fbfd; padding: 125px 0 155px;}
#access h3.h3 { padding: 0 0 40px;}
#access p.text { font-size: 18px; font-weight: bold; padding: 0 0 25px;}
#access .gmap { margin: 0 0 15px;}
#access .gmap iframe { width: 1100px;}
#access ul li { float: left; width: 540px; border-top: 3px solid #00245e; background: #fff; padding: 0 0 50px;}
#access ul li:first-child { margin: 0 20px 0 0;}
#access ul li h4 { padding: 50px 0 15px; font-size: 22px; font-weight: bold;}
#access ul li h4 img { padding: 0 0 20px;}


#history { padding: 155px 0 140px;}
#history h3.h3 { margin: 0 0 35px;}
#history .con { width: 880px; margin: 0 auto;}
#history .con table { width: 100%; text-align: left;}
#history .con table tr th,
#history .con table tr td { padding: 30px 0 30px 20px; border-top: 1px solid #e5e5e5;}
#history .con table tr th { width: 200px; font-family: "ヒラギノ明朝 ProN W6", "HiraMinProN-W6", "HG明朝E", "ＭＳ Ｐ明朝", "MS PMincho", "MS 明朝", serif;}

#staff { background: #f9fbfd; padding: 120px 0 80px;}
#staff ul { margin: 0 0 0 -40px;}
#staff ul li { float: left; width: 340px; margin: 0 0 40px 40px; text-align: center;}
#staff ul li div { padding: 20px 0;}
#staff ul li p { font-family: "ヒラギノ明朝 ProN W6", "HiraMinProN-W6", "HG明朝E", "ＭＳ Ｐ明朝", "MS PMincho", "MS 明朝", serif; font-size: 22px;} 
#staff ul li p span { font-family: 'Lora-Regular'; display: block; font-size: 16px; line-height: 130%;}


/* ------------------------------------------------------------ mobile */
@media only screen and (max-width:640px){
	
#fv { background: url(../images/company/fv.jpg?2004) center top no-repeat; background-size: cover;}

#message { padding: 60px 0 80px; position: relative;}
#message::before { content: ""; position: absolute; background: url(../images/index/bg_01.gif?2004); width: 70%; left: 0; top: 350px; height: 750px; z-index: -1;}
#message img { float: none; width: 100%; height: auto;}
#message .box { float: none; width: 100%; padding: 20px 0 0; margin: 0;}
#message .box h3 { font-size: 20px; margin: 0 0 30px;}
#message .box h3 span { font-size: 33px; display: block; font-style: italic; line-height: 140%; letter-spacing: 2px; padding: 0 0 10px;}
#message .box p { font-size: 14px;}

#outline { padding: 45px 4% 55px;}
#outline h3.h3 { padding: 0 0 25px; }
#outline img { float: none; width: 100%; height: auto; margin: 0 0 20px;}
#outline .con { float: none; width: 100%; padding: 0;}
#outline .con table { width: 100%;}
#outline .con table tr th { padding: 15px 3%; width: 30%;}
#outline .con table tr td { padding: 15px 3%;}
#outline .con table tr.address th { vertical-align: text-top;}


#access { text-align: center; padding: 60px 0 70px;}
#access h3.h3 { padding: 0 0 20px;}
#access p.text { font-size: 14px; font-weight: bold; padding: 0 0 15px;}
#access .gmap { position: relative; padding-bottom: 300px; padding-top: 30px; height: 0; overflow: hidden; }
#access .gmap iframe,
#access .gmap object,
#access .gmap embed { position: absolute; top: 0; left: 0; width: 100%; height: 300px; }
#access ul li { float: none; width: 100%; border-top: 3px solid #00245e; background: #fff; padding: 0 0 25px;}
#access ul li:first-child { margin: 0 0 15px;}
#access ul li h4 { padding: 25px 0 15px; font-size: 16px; font-weight: bold;}
#access ul li h4 img { padding: 0 0 10px; width: 50px; height: auto;}


#history { padding: 55px 0 70px;}
#history h3.h3 { margin: 0 0 25px;}
#history .con { width: 100%; margin: 0 auto;}
#history .con table { width: 100%; text-align: left;}
#history .con table tr th,
#history .con table tr td { padding: 15px 3%; display: block; }
#history .con table tr th { width: 94%; border-top: 1px solid #e5e5e5; padding: 10px 3% 0; font-size: 16px; font-weight: bold; }
#history .con table tr td { border-top: none; padding: 10px 3%;}


#staff { padding: 60px 0 40px;}
#staff ul { margin: 0 0 0 -2%;}
#staff ul li { float: left; width: 48%; margin: 0 0 20px 2%; text-align: center;}
#staff ul li img { width: 100%; height: auto;}
#staff ul li div { padding: 15px 0 20px;}
#staff ul li p { font-size: 18px;} 
#staff ul li p span { display: block; font-size: 14px; line-height: 130%;}



}