@charset "utf-8";
/* ACCORDER Inc. */
/* Base Style
----------------------- */
h2, .caption {
    font-family: 游明朝, YuMincho, "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", HG明朝E, "ＭＳ Ｐ明朝", "ＭＳ 明朝", sans-serif;
    font-size: 16px;
   
}
.clearfix:after { content:"."; display:block; height:0px; clear:both; visibility:hidden; } /* Crearfix for Modern Browsers including Firefox, Opera, Safari, etc */
.clearfix { display:inline-block; } /* For Windows IE7 and Mac IE5 */
* html .clearfix{ height:1px; } /* For Windows IE5/IE6:Hides from IE-mac */
.clearfix { display:block; }
.clear { clear:both; } /* End hide from IE-mac */
html { overflow-y:scroll; } /* For FireFox scrolling */
img { -ms-interpolation-mode:bicubic; image-rendering:optimizequality; vertical-align:bottom; } /* Better images when resized for IE7, FF3.5+ */
a { text-decoration:none; }
a:hover { text-decoration:none; opacity:0.9; }
html,body { background-color:#FFF; }
.img-responsive{ display: block; max-width: 100%; height: auto; }

#box1, #box3, #box4{ padding-bottom:80px!important;}
#box2{ padding-bottom:30px!important;}

#wrapper { background: #fff; font-size:16px; color:#000; }
.container { width:1000px; margin:0 auto; }

/* HEADER	----------------------- */

#header{}
.logo{ padding:35px 0px 15px; }
#header .header_nav{ padding-top:55px; }
	
/* HOMEPAGE	----------------------- */
.alltitlebox{ text-align:center; }
.alltitle{ padding: 10px 20px; text-align:center; font-size:22px; }
.allline{ height:10px; background:url(../images/title_line.png) top center no-repeat; background-size:50px; margin-top:35px; }
.titleleft{ padding-left:0; text-align:left; }

.fadea{ }

#box1{ padding-top:25px; padding-bottom:60px; }
#box1 .text{ padding:35px 55px 15px; line-height:1.9em; }

#box2{ background:url(../images/linebg.png) 60% 155px no-repeat; background-size: auto 4px; padding-top:70px; padding-bottom:55px; }
.box2box{  padding:0px 55px 0px; }
.box2box1{ padding-top:20px; padding-left:45px; }
#box2 .text{ padding-top:50px; line-height:1.8em; }
.caption{ margin-top:-40px; margin-left:-40px; }
.subcaption{ font-size:20px; }

#box3{ background:url(../images/linebg1.png) 40% 165px no-repeat;  background-size: auto 4px; padding-top:70px; padding-bottom:55px; }
.box3box{ padding:0px 55px 0px; }
.box3box1{ padding-top:30px; padding-right:30px; }
#box3 .text{ padding-top:50px; line-height:1.8em; }

						
#box4{ padding-top:0px; padding-bottom:20px; }
.box4box{ padding:45px 55px 0px; font-size:17px; }
.box4box1{ padding: 2px 10px; border-bottom:1px solid #999999; line-height:3em; }
.box4box1 .left{ width:190px; padding-left:5px; display:inline-block; vertical-align:top; text-align:left;  }
.box4box1 .right{ width: calc( 100% - 200px ); padding-left:5px; display:inline-block; vertical-align:top; }

#box5{ padding-top:80px; padding-bottom:0px; }
#box5 .timeline{}
.box5box{  }
#box5 h3{ font-size:30px; color:#000; }
#box5 p{ font-size:20px; color:#010101;}

.timeline { position: relative; width: 100%; margin: 50px auto 0px; padding:0 55px; }

.timeline::after { content: ''; position: absolute; width: 2px; background-color: #b8b8b8; top: 20px; bottom: 0px; left: 50%; margin-left: -3px; }
.box5box { padding: 10px 40px; position: relative; background-color: inherit; width: 50%; }

/* The circles on the timeline */
.box5box::after { content: ''; position: absolute; width: 20px; height: 20px; right: -8px; background-color: #39b54a; top: 15px; border-radius: 50%; z-index: 1; }
.left { left: 0; text-align:right; }

/* Place the container to the right */
.right { left: 50.6%; }


/* Fix the circle for containers on the right side */
.right::after { left: -16px; }



#box6{ padding-top:80px; margin-bottom: 0px;  }
.map{ padding-top:70px; padding-bottom:35px; }
.box6 .text{ margin:0 55px; padding:15px 20px; border-bottom:1px solid #ccc; text-align:center; font-size:16px;  }

/* footer	----------------------- */

#back-to-top{position:fixed; bottom:30px; right:30px; z-index:9999; text-align:center; cursor:pointer; border:0; text-decoration:none; transition:opacity .2s ease-out; opacity:0; }
#back-to-top img{ width:45px; }
#back-to-top.show{ opacity:1 }
#footer{ padding-top:130px; padding-bottom:50px; }
#footer .logo{ padding-top:0px; }
#footer .footet_nav{ padding: 0; margin: 0; padding-top:10px; position: relative; float: right; list-style:none; background:#fff; text-align:right; }
#footer .footet_nav li{ display:inline-block; float:left; }
#footer .footet_nav a{ -o-transition: all .3s linear; -webkit-transition:all .3s linear; -moz-transition: all .3s linear; transition:all .3s linear; outline:none; z-index:10; }
#footer .footet_nav > li > a{ text-decoration:none; display:inline-block; color:#000; font-size:15px; padding:10px 20px; text-transform:uppercase; font-family:'Raleway', sans-serif; font-weight:bold; }
#footer .footet_nav > li:hover > a, #footer .footet_nav > li.active > a{ background:#e0e0e0; color:#555; }	

@media (min-width: 1250px) {
	

  
}


@media (max-width: 1024px) {

}


@media (max-width:768px) {
	.box3box1 {
    padding-top: 0px;
    padding-right: 30px;
}

.caption{ margin-top:0; margin-left:0px; }
.headerleft{ display:none; }
#header .header_nav{ padding-top:0px; }
#box1 .text, .box2box, .box3box, .box4box, .timeline{ padding-left:60px; padding-right:60px; }
.box6 .text{ margin-left:80px; margin-right:80px; }
}

@media (max-width: 640px) {
	#box4{ padding-top:50px; padding-bottom:20px; }
.box4box1 .right, .box4box1 .left{
	font-size: 13px;
	    line-height: 2;
}
h3, .h3 {
    font-size: 20px;
}
.box4box1 {
    padding: 17px 10px;
    border-bottom: 1px solid #ccc;
    line-height: 3em;
}
.box6 .text{
	font-size: 14px;
}
#box1 .text, .box2box, .box3box, .box4box, .timeline{ padding-left:30px; padding-right:30px; }
.box6 .text{ margin-left:5px; margin-right:5px; }

.box4box1 .left{ width:125px; }
.box4box1 .right{ width: calc( 100% - 135px ); }
}
 
 

 
/* Landscape phones and down */
@media (max-width: 480px) {

.container { width:100%; }
#box2 .titleleft, #box3 .titleleft{ padding-top:30px; font-weight:bold; }
#box2 .text, #box3 .text{ padding-top:0px; }
#box2 img, #box3 img{ width:75%; }
 #box3 img {
    width: 80%;
}
#box1 .text, .box3box, .box4box, .timeline{ padding-left:20px; padding-right:20px; }
.box6 .text{ margin-left:5px; margin-right:5px; }
.box2box{ padding-left:0; padding-right:25px; }
.caption{ padding-top:20px;  text-align:center; }
.box3row{ display:flex; flex-direction: column-reverse; }

.timeline::after { left: 31px; margin-left:13px; }
/* Full-width containers */
.box5box { width: 100%; padding-left: 70px; padding-right: 25px; }
/* Make sure that all arrows are pointing leftwards */
.box5box::before { left: 60px; border: medium solid white; border-width: 10px 10px 10px 0; border-color: transparent white transparent transparent; }
/* Make sure all circles are at the same spot */
.left::after, .right::after { left: 15px; }
/* Make all right containers behave like the left ones */
.right { left: 0%; } 
.left{ text-align:left; } 
#box1, #box2, #box3, #box4, #box5, #box6{ padding-bottom:0px;}
#box6{ padding-top:80px; }

#footer .logo{ text-align:center; }
#footer .footet_nav{ float:none; text-align:center; }
#footer .footet_nav li{ text-align:center; float:none; }


}

@media (max-width: 375px) {
	
	
}

@media (max-width: 320px) {



}