@charset "utf-8";
/* -------------------------------------------------------------------
 * Author: ADVANCED INFORMATION DESIGN Co.,Ltd.
 * Version: 1.0
 * Created on: 2016.06.01
---------------------------------------------------------------------- */

.section_wrap{ padding-bottom:100px }

h2.title { text-align: center; }

/* -- header --------------------------------------------------------- */
#header { position:relative; display: block; width: 100vw; height: 93vh; border-top: none; vertical-align: middle; }
#header #gnavi_wrap #gnavi>ul li.nav_01 .en{ width: 60px; background-image: url(../img/nav_w_01.png) }
#header #gnavi_wrap #gnavi>ul li.nav_02 .en{ width: 130px; background-image: url(../img/nav_w_02.png) }
#header #gnavi_wrap #gnavi>ul li.nav_03 .en{ width: 50px; background-image: url(../img/nav_w_03.png) }
#header #gnavi_wrap #gnavi>ul li.nav_04 .en{ width: 130px; background-image: url(../img/nav_w_04.png) }
#header #gnavi_wrap #gnavi>ul li.nav_05 .en{ width: 70px; background-image: url(../img/nav_w_05.png) }
#header #gnavi_wrap #gnavi>ul li.nav_06 .en{ width: 80px; background-image: url(../img/nav_w_06.png) }
#header #gnavi_wrap #gnavi>ul>li>a{ color:#fff; }
#header div#topimage { position: absolute; top: 0; height: 93vh; z-index: 0; }
#header div#topimage ul li { list-style: none; position:absolute; display: block; height: 93vh; background-position: 50% 50%; background-repeat:no-repeat; background-size: cover; }
#header div#topimage div.catch { position:relative; top: 40%; }
#header div#topimage div.catch dl dt{ text-align: center; font-weight: bold; font-size: 42px; padding-bottom: 30px; color:#fff; text-shadow: 3px 3px 10px #000, -3px 3px 10px #000, 3px -3px 10px #000, -3px -3px 10px #000; }
#header #scroll { position:relative; width: auto; text-align: center; z-index: 1; top: 75%; }

/* -- main --------------------------------------------------------- */

/* story */
#story { background: url("../img/nonslip_img.png") no-repeat right 30%; background-size: 30% auto; padding-top:100px }
#story p{ width:425px;margin-bottom:0px;margin-left:auto;margin-right:auto; }
#story h2.title{ width:256px; }

/* guidance */
#guidance .information { display:table; width: 1320px; margin-left:auto; margin-right:auto; border-collapse: separate; border-spacing: 60px 0; margin-top: 30px; }
#guidance .information div { display:table-cell; padding:5px 5px 10px 5px;width:20%;transition-delay:0.3s;-moz-transition-delay:0.3s;-webkit-transition-delay:0.3s;-o-transition-delay:0.3s;-ms-transition-delay:0.3s;transition:all 0.3s cubic-bezier(0.23, 1, 0.32, 1);-moz-transition:all 0.3s cubic-bezier(0.23, 1, 0.32, 1);-webkit-transition:all 0.3s cubic-bezier(0.23, 1, 0.32, 1);-ms-transition:all 0.3s cubic-bezier(0.23, 1, 0.32, 1);box-sizing:border-box}
#guidance .information article img { opacity:0.8 }
#guidance .information article :hover > img { opacity:0.4 }
#guidance .information article time,
#guidance .information article .title{ letter-spacing:0.1em }
#guidance .information article .title a{ display:block; vertical-align:middle; }
#guidance .information article time,
#guidance .information article .title{display:block; text-align: left; }
#guidance .information article time{ margin-top: 5px; border-top: 1px solid #d9d7cd; }
#guidance .information article .title{ position:relative; margin: 5px 0 10px 0; border-bottom: 1px solid #d9d7cd;}
#guidance .information article .title a{text-decoration:none;line-height:1.47;font-size:120%;}
#guidance .information article img{ object-fit: contain; height:200px; width:350px; }
#guidance .information article .text{font-size:12px}
#guidance .information article span.photo { position:relative; display:block; width: 350px; height: 200px; text-align: center; vertical-align: middle; }
#guidance .information article span.photo img { width: auto; height: auto; max-width: 350px; max-height: 200px; } 
#guidance .information article span.photo p.text { text-align: center; width:98%; font-size:150%; top: 40%; margin:0; padding:0; position:absolute; font-weight: bold; color:#fff; text-shadow: 3px 3px 10px #000, -3px 3px 10px #000, 3px -3px 10px #000, -3px -3px 10px #000; }

#guidance .information_all { text-align:right; }
#guidance .information_all a{ padding: 2.5px 5px; border:1px solid #1d3156;background-color:#fff;color:#1d3156;text-decoration:none;border-radius: 15px; }
#guidance .information_all a:hover{border:1.5px solid #1d3156;background-color:#1d3156;color:#fff;}

/* map_area */
#map_area address{position: relative;margin-bottom:25px;}
#map_area h2{display:inline-block;margin:0 18px 0 0;}
#map_area p{display:inline-block;padding-right:5px;}

/* contact_area */
#contact_area { background-color:#F8F494; }
#contact_area #contact{ padding:75px 0;position: relative; }
#contact_area #contact h2{ display:inline-block; margin:0 18px 0 0; }
#contact_area #contact p{ display:inline-block; padding-right:5px; }
#contact_area #contact p.tel { margin-left:40px; }
#contact_area #contact p span { font-size:150% }
#contact_area #contact a{ border:1.5px solid #fff; background-color:#fff; color:#1d3156; font-size:150%; margin-left:40px; padding:5px 40px;text-decoration: none; border-radius: 5px; }
#contact_area #contact a:hover{ border:1.5px solid #1d3156; background-color:#1d3156; color:#fff; }