@charset "UTF-8";
/* COMMON CSS Document */
.content{margin:0 auto; width:1200px;}
.content960{margin:0 auto; width:960px;}

/*HEADER
====================================*/
#header_bg{ background:url(../images/header_bg.png) no-repeat center top; background-size: 100% auto; padding:16px 0; width:100%; background-position:100% -20px;}	/*2016-11-09*/
#logo{ padding-top:14px; float:left;}
#header_right{ float:right;}
#header_contact{text-align:right; margin-bottom:20px; float:right;}	
#header_contact li{ margin-left:10px; line-height:1; padding-top:13px; display:inline-block;}		/*2017-01-05*/
/*a
#header_contact li:first-child,#header_contact li:nth-of-type(2){ width:10%; vertical-align:top; font-weight:bold; color:#21a879; font-family:Arial,sans-serif,Helvetica Neue,Helvetica;}	
dd 2017-01-20*/
#header_contact li a{ color:#333;}
/*#header_contact li:first-child{ padding-top:12px;}*/
#header_contact li:last-child{padding-top:0;}
#header_contact a:hover{ opacity:0.8; color:#21a879;}

/*NAVIGATION
====================================*/
#gnav li{ float:left; font-size:18px; font-weight:bold; line-height:1.2; position:relative;}	/*2016-11-10*/
#gnav li span{ display:none;}
#gnav li.active,#gnav li:hover{ color:#00a76d;}
/*add 2016-11-10*/
.navchild{ color:#080808; display: none; padding-top:5%; box-sizing:border-box; position:absolute; left:0; top:95%; width:100%;}
.navchild li{ font-size:13px !important; float:none !important; font-weight:normal !important; padding:7px 5px; background:#e9f6f1; border-bottom:1px solid #fff; box-sizing:border-box; width:100% !important;}
.navchild.active{ color:#21A879;}

#btnmenu, #btnclose{ display:none;}

/*MAIN CONTENT
====================================*/
#container{}
#bg{ width:100%; background:url(../images/bg.png) repeat-y center top; background-size:100% auto;}	/*2016-10-27*/
#bg_gray{ width:100%;background:url(../images/bg_gray.png) repeat-x center top; padding-top:1px; margin:0 auto;}
.banner_inner{ width:100%; max-width:1600px; margin:auto;}
.banner_img{ float:right;}
h2{ color:#693b0c; font-size:30px; font-weight:bold; white-space: nowrap; float:left; margin-left:15%; margin-top:5%;}

/*TABS*/
.tabs{ margin:auto; background:url(../images/bg.png) no-repeat center top; padding:22px 0 25px; background-size:100% auto;}	/*2016-10-27*/
.tabs li a{ width:218px; float:left; margin-right:25px; background:#21a879; border-radius:5px; padding:15px 14px; box-sizing:border-box; color:#fff; font-size:19px; text-align:center; font-weight:bold;}
.tabs li:last-child a{ margin-right:0;}
.tabs li a:hover,.tabs li.active a{ opacity:0.7; display:block;}

h3{ font-size:36px; line-height:36px; color:#21a879; font-weight:bold; margin-bottom:35px;}
h4{ background:#e9f6f1; font-size:26px; line-height:26px; font-weight: bold; color:#21a879; padding:25px 30px; box-sizing:border-box; margin-bottom:25px;}
h4 span{ display:inline-block;}
h5{ background:#21a879; border-radius:5px; color:#fff;  padding:9px; box-sizing:border-box; margin-bottom:10px;}
h5 p{ background:url(../images/h5.png) no-repeat left center; font-size:18px; padding-left:28px; line-height:18px;}
h6{ border-bottom:4px solid #21a879; padding-bottom:5px; margin-bottom:30px;}
h6 p{ font-size:18px; line-height:18px; color:#21a879; font-weight:bold; background:url(../images/h6.png) no-repeat left center; padding-left:30px; margin-left:10px;}
.block_h3{ padding:50px 0; font-size:15px;}
.hp a{ background:#f39800; border-radius:50px; color:#fff; font-weight:bold; font-size:20px; text-align:center; padding:7px 2%; box-sizing:border-box; width:260px; margin:auto; display:block;}	/*2016-10-27*/
.hp a:hover{ opacity:0.8;}

/*FIRST PAGE EACH TAB*/
.first_page { margin-top:70px;}
.first_page .relative{ position:relative;}
.first_page .fl{ float:left; width:49%;}
.first_page .fr{ float:right; margin-bottom:2%; width:49%;}
.first_page .block_view{padding:40px 20px; box-sizing:border-box; background:url(../images/border.png) no-repeat center center; background-size:100% 100%;}
.first_page .view_img{ float:left; width:41.55%;}
.first_page .view_info{ float:right; width:54.8%;}
.first_page .view_tit{ font-size:25px; color:#693b0c; text-align:center; font-weight:bold;}
.first_page .readmore{ padding-top:50px; text-align:center; display:block;}
.first_page .readmore a:hover{ opacity:0.8;}
.first_page .chara_01{ position:absolute; top:-50px; left:0; z-index:10;}
.first_page .chara_02{ position:absolute; bottom:-41px; right:-4%;}

/*TABLE*/
.tbl{ width:760px;}	
.tbl table{ width:100%;margin-bottom:20px;}
.tbl th,.tbl td{ border-bottom:1px dotted #21a879; padding:15px 2%;}
.tbl th{ border-right:1px dotted #21a879; width:220px; text-align:center; vertical-align: top;}
.tbl td{ padding-left:25px;}

/*add 2016-10-27*/
/*SLIDER*/
.slider .bx-wrapper{ margin-bottom:0 !important;}
.slider { margin-bottom:20px;}
.slider .fl{ float:left; width:876px; margin-right:15px;}
.slider .fr{ float:right; width:308px;}
.slider .bx-pager a{ margin-bottom:12px; float:left;}
.slider .bx-pager a:nth-of-type(2n){ margin-left:10px;}
.slider .bx-pager a:nth-of-type(5n){ margin-bottom:0;}
.slider .bx-pager a.active{ opacity:0.5;}
.table{ width:100%;}
.table th,.table td{border-top:1px dotted #21a879; text-align:left;}
.table th{ padding-left:0;}
.table td{ padding-left:15px;}
.table .hp a{ margin:0;}
.table .fl{ float:left; width:48%;}
.table .fr{ float:right; width:48%;}
.table h5{ margin-bottom:20px;}

/*add 2016-11-07*/
/*h4-map link*/
h4 a{background:#21a879;color:#fff;padding:4px 20px;-webkit-border-radius: 25px;-moz-border-radius: 25px;border-radius: 25px;text-align: center;display:inline-block; font-weight:bold; font-size:15px; float:right; width:140px;}
h4 a:hover{background:#4cbd96;}
h4 p{ float:left;}

/*FOOTER
===================================*/
#footer{ position:relative;}
#footer_bg{ color:#fff; background:#21a879; padding:50px 0 20px;}
#footer_nav{ float:right; font-weight:bold;}
#footer_nav li{ float:left; margin-left:20px; font-size:14px;}
#footer_nav li:first-child{ margin-left:0;}
#footer_nav li.active,#footer_nav li:hover{ color:#000;}
#footer_contact{ display:none;}
#copyright{ float:left; font-size:12px; padding-top:2px;}
#copyright span{ display:inline-block;}
.pagetop{ width:100%; text-align:center; position: absolute; top:-18%;}
#footer_nav_sp{ display:none;}

/*add 2016-10-19*/
#header{ position: fixed; width:100%; z-index:9999; background-color:#fff;}	/*2016-11-10*/
.pagetop{ position:fixed; bottom:20px; right:20px; top:auto; text-align:right; z-index:51; width:65px;}	/*2016-10-28*/
#wrapper{ position:relative;}
#footer_bg{ padding:30px 0 20px; z-index:0;}
h4{ line-height:1.4;}

/*===============================
             MEDIA
================================*/
@media only screen and (max-width:1450px){
h2{ margin-left:8%;}	

/*add 2016-10-28*/
.pagetop{ bottom:50px;}

/*add 2016-11-09*/
#header_bg{ background-position:inherit;}
}
@media only screen and (max-width:1250px){
/*FIRST PAGE EACH TAB*/	
.first_page .chara_02{ right:0;}	
.first_page .readmore{ padding-bottom:7%; padding-bottom:10%;}
}
@media only screen and (max-width:1200px){
.content{ width:98%;}	

#header_contact li{padding-top:8px;}
/*#header_contact li:first-child{ padding-top:7px;}*/
#header_contact li:last-child img{width:120px;}
#logo{ width:20.625%;}

.navchild li{ font-size:1.1vw !important;}

.tabs li a{ width:18.4%; margin-right:2%; padding:1.5%; font-size:1.5vw;}
h2{ margin-left:1%;}
/*TABLE*/
.tbl{ width:63.33%;}
.tbl th{ width:28.95%;}

/*add 2016-10-27*/
/*SLIDER*/
.slider .fl{ margin-right:0; width:73%;}
.slider .fr{ width:26%;}
.slider .bx-pager a:nth-of-type(2n){ margin-left:2%;}
.slider .bx-pager a{ margin-bottom:2%; display:block; width:48%;}
.table{ width:100%;}
.table .hp a{ width:60%;}
.table th{ width:36.67%;}

}
@media only screen and (max-width:1160px){
#footer_nav{ float:none; width:755px; margin:auto;}
#footer_bg{ padding:0;}
#footer_nav{ padding-top:40px;}
#copyright{ float:none; width:100%; text-align:center; padding:10px 0;}	

}
@media only screen and (max-width:980px){
/*add 2016-11-08*/
/*h4 map link*/
h4{ font-size:2.4vw;}	
}
@media only screen and (max-width:960px){
.content960{ width:98%;}	
#header_bg{ padding:1% 0 2%;}
#header_contact{ margin-bottom:2%;}
/*add 2016-10-28*/
.pagetop{ bottom:70px; right:0;}
#bg{ margin-top:0;}
h2,h3{ font-size:24px;}
.block_h3{ padding:4% 0;}
h4{ padding:2%; line-height:1.5;}
h6{ margin-bottom:3%;}

/*FIRST PAGE EACH TAB*/
.first_page { margin-top:10%;}
.first_page .readmore{ padding-top:20px; padding-bottom:20%; width:80%; margin:auto; }	/*2016-10-27*/
/*add 2016-11-04*/
#header{ background:#fff;}

#header_right{ width:64.8%;}
#gnav li:nth-of-type(1){width:10.17%;}
#gnav li:nth-of-type(2){width:17.21%;}
#gnav li:nth-of-type(3){width:23.16%;}
#gnav li:nth-of-type(4){width:18.46%;}
#gnav li:nth-of-type(5){width:13.14%;}
#gnav li:nth-of-type(6){width:17.84%;}
}

@media only screen and (max-width:840px){
/*FIRST PAGE EACH TAB*/
.first_page .view_img,.first_page .view_info{ float:none; width:100%;}	
.first_page .view_img{ text-align:center;}
.first_page .block_view{ background:none; border:3px dashed #34ad82; border-radius:20px;}
.first_page .readmore{ padding-bottom:0;}

/*add 2016-11-08*/
/*h4 map link*/
h4 a{ font-size:1.6vw; width:120px;}
/*add 2017-01-05*/
#header_contact li:last-child{ width:45%;}
#header_contact li{ padding-top:4px;}
/*#header_contact li:first-child{ padding-top:3px;}*/
#header_contact li:first-child,#header_contact li:nth-of-type(2){ font-size:1.5vw; padding-top:6px;}
}

@media only screen and (max-width:768px){
#footer_nav{ width:710px;}
#footer_nav li{ margin-left:2%;}
}

@media only screen and (max-width:736px){
#header{ position:relative;}
#header_bg{ padding:1% 0 0;}
#header_contact{padding-right:14%;}
#header_contact li:first-child,#header_contact li:nth-of-type(2){/* width:35%;*/ padding-top:20px; font-size:3.8vw;}	/*add 2017-01-05*/
/*#header_contact li:first-child{ padding-top:14px;}*/
#header_contact li:last-child{display:none;}
#logo{ padding-top:0; width:28%;}
#header_right{ float:none; width:100%;}
#gnav{ margin:1% 0 2%;}
#gnav li.active,#gnav li:hover{ color:#000; opacity:0.8; border-bottom:1px solid #ccc !important;}
#gnav li{ display:none;float:none; width:100% !important; background:#21A879; color:#fff; text-align:center; margin:auto !important; border-bottom:1px solid #fff; font-size:14px; padding:1% 2%; box-sizing:border-box;}
#gnav li img{ display:none;}
#gnav li span{ display:block;}
#gnav li span::after{ content:attr(data-text);}
#btnmenu, #btnclose{ display:block; cursor:pointer; width:15%; position:absolute; top:0; right:1%;}
#btnclose{ display:none;}
#footer_nav{ display:none;}
#footer_nav_sp{ display:block; color:#fff; padding-bottom:20px; width:250px; margin:auto; font-weight:bold; line-height:14px;}
#footer_nav_sp li{ float:left;}
#footer_nav_sp li.active,#footer_nav_sp li:hover{ color:#000;}
#footer_nav_sp li:first-child{ margin-right:10px; border-right: 1px solid #fff; padding-right:10px; padding-left:6%;}
#footer_contact{ display: block; text-align:center; padding:60px 0 20px;}
#footer_contact a:hover{ opacity:0.8;}
#copyright{ padding:0 0 2%;}
.tabs li a{ width:100%; display:block; margin-right:0; font-size:16px; margin-bottom:1%; padding:1%; float:none;}
h2{ margin-top:4%; font-size:18px;}
h3{ margin-bottom:2%;}
h4{ font-size:18px; margin-bottom:4%;}
h5{ font-size:14px; line-height:14px;}
.hp a{ width:200px; font-size:16px; padding:1%;}
.block_h3{ font-size:15px;}

/*FIRST PAGE EACH TAB*/
.first_page{ margin-top:5%;}
.first_page .block_view{ width:100%; padding:4% 2%; margin-bottom:4%;}
.first_page .fl,.first_page .fr{ float:none; margin-left:0; width:100%;}
.first_page .chara_01,.first_page .chara_02{ display:none;}

/*TABLE*/
.tbl{ width:100%;}

/*add 2016-10-04*/
#footer_nav_sp, #footer_contact{ display:none;}
#copyright {    padding: 30px 0 2%;}
#gnav li{ width:50% !important; float:left; font-size:24px; line-height:1.7;}
#gnav li:nth-of-type(9){ background:#28a7e1;}
#gnav li:nth-of-type(2n+1){border-right:1px solid #fff;}
#gnav li.active,#gnav li:hover{ color:#fff; background:#015639; opacity:1;}
#gnav {
    margin: 0;
    position: absolute;
    width: 100%;
    top: 100px;
    left: 0;
    z-index: 9;
}

#header{ position:static; border-bottom:5px solid #21a879;}
#btnmenu, #btnclose{ width:10%; top:2%; right:2%;}
#header_bg { padding: 2% 0;}
#gnav{ margin:0;}

/*add 2016-10-19*/
#header{ position:fixed; background:#fff;}
#btnmenu, #btnclose{ top:10%;}

/*add 2016-10-27*/
/*SLIDER*/
.slider { margin-bottom:4%;}
.slider .bx-wrapper{ margin-bottom:2% !important;}
.slider .fl,.slider .fr{ float:none; width:auto;}
.slider .bx-pager a{ width:19.2%; margin-bottom:1%; margin-right:1%;}
.slider .bx-pager a:nth-of-type(2n){ margin-left:0;}
.slider .bx-pager a:nth-of-type(5n){ margin-bottom:1%; margin-right:0;}
.table .hp a{ margin:auto;}
.table th, .table td{ border-top:none;}
.table .fl tr:first-child th,.table .fl tr:first-child td{border-top:1px dotted #21a879;}
.table .fl,.table .fr{ float:none; width:auto;}
.table table{ margin-bottom:0;}
.table .hp{ margin-top:20px;}

/*add 2016-11-04*/
.navchild{ display:none;}
h4 a{ font-size:13px; padding:2px 2%;}
/*add 2016-11-07*/
/*h4-map link*/
h4 p, h4 a{ float:none;}
h4 a{ margin:5px auto 0; width:140px; display:block;}
h4 span{ display:inline;}
/*add 2016-11-11*/
#gnav.hide{ display:none;}

}
/* Landscape */
@media only screen 
  and (min-device-width: 320px) 
  and (max-device-width: 736px)
  and (orientation: landscape) {
	#gnav{height:200px; overflow:auto; }
	#gnav li, #gnav li span{ font-size:14px !important;}
}

@media only screen and (max-width:550px){
#logo{ width:30%;}	
}
@media only screen and (max-width:480px){
#logo{ width:37%;}	
#btnmenu, #btnclose{ width:12%;}	
#bg{ background:none;}
p, table{ font-size:12px;}
h2{ margin-top:2%; font-size:14px;}
.tabs{ padding:4% 0;}	/*2016-10-27*/
.tabs li a{ font-size:12px;}
h3{ font-size:16px;}
h4{ font-size:14px; padding:2%;}
h5{ font-size:12px;}
h6 p{ font-size:14px; background-size:10px auto; padding-left:4%;}
#footer_contact{ padding-top:50px;}

/*FIRST PAGE EACH TAB*/
.first_page .view_tit{ font-size:16px; padding:1% 0;}
.first_page .view_img{ width:40%; margin:auto;}

/*TABLE*/
.tbl th,.tbl td{ display:block; width:100%; padding-left:0; text-align:left; padding:10px; box-sizing:border-box;}
.tbl th{ background:#C3E6D9;}
.tbl td{ background:#EBF7F2;}

#gnav li, #gnav li span{ font-size:20px;}

/*add 2016-10-19*/
#btnmenu, #btnclose{ top:14%;}
.no-pd .first_page_bottom{ margin-top:70px;}

/*add 2016-10-27*/
.first_page .readmore{ width:45%; } 

/*add 2016-12-21 */
#header_contact{padding-right:16%;}
}

@media only screen and (max-width:375px){
#logo{ width:44%;}			
#gnav li, #gnav li span{ font-size:14px !important;}
#header_contact{ width:35%;}	/*add 2017-01-05*/
/*
#header_contact li:first-child, #header_contact li:nth-of-type(2){ width:30%; padding-left:0; margin-left:0; font-size:13px; padding-top:17px;}	
add 2017-01-05*/
.tabs li a{ font-size:12px;}

/*add 2016-10-19*/
#btnmenu, #btnclose{ top:17%;}
/*add 2016-10-28*/
.pagetop{ width:50px;}
}