/* IMPORT RESET */
@import url("reset.css");

/* IMPORT 12 COLUMN RESPONSIVE GS */
@import url("responsive.gs.12col.css");

/* ICOMOON */
@import url("icomoon.css");


/*	EXAMPLE STYLES */
body {
	font-family: Meiryo,"メイリオ","ＭＳ Ｐゴシック",Osaka,sans-serif;
	color: #333;
	font-size: 13px;
	background-color:#faf9f4;
}

/* ----------   header  --------------------- */
header {
	padding-bottom:0px;
  border-top: solid 6px #ff6000;
	background-color:#faf9f4;
}


/* ----------   article  --------------------- */

article {
	margin:0px 0 10px;
}

main{
padding:0px 0px 30px 0px ;
}

main p{
line-height:1.8;
}

@media only screen and (max-width: 768px) {
main{
padding:10px 8px 30px 8px ;
}
}

/* ----------   section  --------------------- */
section {

}

aside {
	margin:0px 0 10px;
}



/* ----------   footer  --------------------- */
footer {
	padding:0px 0px 0px;
}

#link_area{
text-align:center;
margin:10px 0;
}


#link_area img{
margin:5px 0;
}


#main_img {
	margin:0px auto 40px;
	padding: 0% 0 0;
	animation-name: RightToLeft;
	animation-duration: 2s;
}

#main_img .inner{
	width: 100%;
	height: 550px;
	background:url(../images/main.png) no-repeat center 0;
}

#main_img h2{
	text-align:center;
	padding:0px 0 0;
	font-size:300%;
	line-height:1.6;
	font-weight:bold;
	color:#ffd200;
	text-shadow:2px 2px 3px #000;
}
#main_img h2 span{
	color:#ff5a00;
	font-size:130%;
}

#main_img p.un{
	color:#fff;
	font-size:200%;
	font-weight:bold;
	text-align:center;
	text-shadow:2px 2px 3px #000;
}

#main_img p.up{
        padding:110px 0 0;
	color:#fff;
	font-size:200%;
	font-weight:bold;
	text-align:center;
}

#main_img p.up span{
        background:#76f809;
        padding:0 15px;
        color:red;
        margin:0 3px;
}


#main_img .br-sp{
	display:none;
}

@media only screen and (max-width: 1400px) {
#main_img {
	margin:0px auto 40px;
	padding: 63.492% 0 0;
	position: relative;
	width: 100%;
	height: 100%;
}

#main_img .inner{
	position: absolute;
	background:url(../images/main02.png) no-repeat center 0;
	background-size:cover;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
}

#main_img p.up{
        padding:210px 0 0;
}
#main_img h2{
	padding:0px 0 0;
}

#main_img .br-sp{
	display:block;
}

}

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

#main_img {
	margin:0px auto 20px;
}

#main_img p.up{
        padding:100px 0 0;
        font-size:140%;
}
#main_img h2{font-size:170%;padding:0px 0 0;}

#main_img p.un{font-size:140%;}

}

@media only screen and (max-width: 768px) {
#main_img p.up{
        padding:60px 0 0;
        font-size:120%;
}
#main_img h2{font-size:160%;padding:0px 0 0;}

#main_img p.un{font-size:100%;}

#main_img p br{
	display:block;
}

}

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

#main_img h2{font-size:140%;}

#main_img p.un{font-size:100%;}

}

.nak_tt{
background:url(../images/main_06.png) repeat-x 0 bottom;
background-size:600px;
	animation-name: RightToLeft;
	animation-duration: 2s;
}

.nak_tt h2{
font-weight:bold;
padding:2% 0% 3% 0%;
font-size:180%;
color:#704c40;
text-shadow:1px 1px 1px #fff;
}

.nak_tt h2:first-letter{
font-size:130%;
color:#c88d0f;
}


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

.nak_tt{
margin:0px 0px 20px ;
background-size:300px;
}

.nak_tt h2{
font-weight:bold;
font-size:140%;
}


}



/* ----------   menu  --------------------- */

#menu-box{
  margin:10px 0px 20px 0px ;
  padding:10px 0px 10px 0px ;
  background-color: #ffad7c;
}

#menu{
  margin: 0px 0 0px;
  padding: 0;
  font-size:100%;
}
#menu li{
  float: left;
  text-align:center;
  line-height:1.2;
  width: 15%;
  margin: 0;}

#menu li:first-child{
  width: 10.0%;
  }


#menu li a{
  display: block;
  padding: 10px 0px 10px;
  color: #303131;
  text-align: center;
	line-height: 1.3;
  font-weight:bold;
  text-decoration: none;
  background:url(../common_img/g_nav_li.png) repeat-y 0 center;
}
#menu li:last-child a{
  background:url(../common_img/g_nav_li.png) repeat-y right center,url(../common_img/g_nav_li.png) repeat-y 0 center;
}


#menu li a:hover{
  color: #fff;
  background-color:#ff6000;
}

#menu li dd{ display:none; position: absolute; z-index:100; top:168px;padding:0; border:solid 1px #fff;background:#ff6000;}


#menu li ul.sub_nav { padding:0 0 0;display:block; overflow: hidden;margin:0;font-size:90%;}
#menu li ul.sub_nav li { width:300px;float: none; color:#fff; padding:0 0px; margin-bottom:1px; height:auto; list-style:none; }
#menu li ul.sub_nav li a { background:none!important;color:#fff; text-align:left; padding:10px 20px 10px 20px; height:auto;text-decoration:none;border-bottom:dotted 1px #fff;}
#menu li ul.sub_nav li a:hover { background:#bf4800!important;color:#fff; text-align:left;}
#menu li ul.sub_nav li a:before { content:'\e910'; margin-right:15px;font-family:'icomoon';color:#fff;}

#menu li ul.sub_nav li a {
	opacity:0.9;
	filter: alpha(opacity=90);
	-ms-filter: "alpha( opacity=90 )";
}

#menu li ul.sub_nav li a:hover {
	opacity:1;
	filter: alpha(opacity=100);
	-ms-filter: "alpha( opacity=100 )";
	-webkit-transition: opacity linear 0.4s; -moz-transition: opacity linear 0.4s; transition: opacity linear 0.4s;
}


#toggle{
 display: none;
}


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

#menu-box{
  margin:20px 0px 20px 0px ;
}

#menu{
  margin: 0px 0 0px;
  padding: 0;
  font-size:100%;
}

#menu li a{
  padding: 15px 0 15px;
}


}

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

#menu{
  margin: 0px auto 0px;
}

#menu li dd{ top:50px;}


}
@media only screen and (max-width: 580px) {
  #menu{
    display: none;
  }

#menu-box{
  background:none;
  margin:20px 0px 0px 0px ;
  padding:0px 0px 0px 0px ;
}

  #menu li{
    width: 100%;
    background:#ff985b;
    border-bottom:dotted 1px #ff81a9;
  }
#menu li:first-child{
  width: 100.0%;
  }

  #menu li a,#menu li:last-child a{
    background:none;
  }


  #menu li.nak{
    width: 100%;
    border-bottom:dotted 1px #fff;
    background:none;
  }
  #menu li.hom{
    width: 100%;
    border-bottom:dotted 1px #fff;
  }


  #toggle{
    display: block;
    position: relative;
    width: 100%;
    background:#ffad7c;
    border-bottom:solid 1px #ffb9cf;
  }

  #toggle a{
    display: block;
    position: relative;
    padding: 10px 0 8px;
    color: #303131;
    text-align: center;
    text-decoration: none;
		font-weight: bold;
  }
  #toggle:before{
    display: block;
    content: "";
    position: absolute;
    top: 50%;
    left: 10px;
    width: 20px;
    height: 20px;
    margin-top: -10px;
    background: #303131;
  }
  #toggle a:before, #toggle a:after{
    display: block;
    content: "";
    position: absolute;
    top: 50%;
    left: 10px;
    width: 20px;
    height: 4px;
    background: #ffad7c;
  }
  #toggle a:before{
    margin-top: -6px;
  }
  #toggle a:after{
    margin-top: 2px;
  }

#menu li dt{ position: relative;}
#menu li dd{ display:none; position: absolute; z-index:100; top:325px;padding:0; border:none;width:100%;background:none;}
#menu li ul.sub_nav { padding:0 0 0;display:block; overflow: hidden;margin:0;font-size:100%;}
#menu li ul.sub_nav li { width:100%;float: none; color:#fff; padding:0 0px; margin-bottom:1px; height:auto; list-style:none; }
#menu li ul.sub_nav li a { background:#ffb9cf!important;color:#333; text-align:left; padding:10px 20px 10px 20px; height:auto;text-decoration:none;border-bottom:none;}
#menu li ul.sub_nav li a:hover { background-color:#ffb9cf!important;text-align:left;}
#menu li ul.sub_nav li a:before { content:'\e910'; margin-right:15px;font-family:'icomoon';color:#008bc5;}

}





.btn01 {}

.btn01 a:before { content:'\e910'; margin-right:10px;font-family:'icomoon';color:#fff;font-size: 100%; }

.btn01 a{
	color:#fff;
	font-weight:bold;
	text-decoration:none;
	font-size:100%;
	display:block;
	padding:5px 0px;
	background:#0058ad;
	text-align:center;
	-webkit-border-radius:0 0 5px 5px; -moz-border-radius: 0 0 5px 5px; border-radius: 0 0 5px 5px;
}

.btn01 a:hover{
	background:#2eafe6;　/* Firefox用 */
}


.btn02 {
	padding: 15px;
}

.btn02 a:before { content:'\e910'; margin-right:10px;font-family:'icomoon';color:#fff;font-size: 100%; }

.btn02 a{
	color:#fff;
	font-weight:bold;
	text-decoration:none;
	font-size:110%;
	display:block;
	/* margin-top: 20px; */
	padding:10px 0px;
	background:#f69404;
	text-align:center;
	-webkit-border-radius:5px; -moz-border-radius: 5px; border-radius: 5px;
}

/* .btn02 a:hover{
	background:#0058ad;
}
 */


.link_box{
-webkit-transition: opacity linear 0.4s; -moz-transition: opacity linear 0.4s; transition: opacity linear 0.4s;
}

.bl-hover{
	opacity:0.6;
	filter: alpha(opacity=60);
	-ms-filter: "alpha( opacity=60 )";
	background: #fff;
	-webkit-transition: opacity linear 0.4s; -moz-transition: opacity linear 0.4s; transition: opacity linear 0.4s;
}

/* ----------   バナー  --------------------- */

.banner{
margin:20px auto 0px;
width:80%;
background-color:#fff;
border:solid 1px #dddddd;
border-top:solid 10px #fedc01;
position:relative;
padding:1.5% 2%;
}


.banner dt{
padding:0px 10px 5px 10px ;
font-weight:bold;
line-height:1.3;
color:#a85b64;
font-size:140%;
text-align:center;
}


.banner dd{
text-align:center;
}


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

.banner{
width:90%;
margin:10px auto 10px;
}

.banner figure{
display:none;
}

.banner dl dt br{
display:none;
}

.banner dl dd{
text-align:center;
}

.banner dl dd span br{
display:none;
}


}


/* ----------   右サイド  --------------------- */

.side_box{
border:solid 6px #ff6000;
background:#faf9f4;
padding:15px;
}

.side_box h3{
text-align:center;
padding:5px 10px;
margin:0px auto 15px;
color:#303131;
font-size:140%;
font-weight:bold;
border-bottom:double 4px #fedc01;
}

.side_box h3 span{
padding:0px 10px;
font-size:90%;
font-weight:normal;
}


.side_box p{
text-align:center;
padding:0px 0px 0px 0px ;
color:#303131;
font-size: 120%;
font-weight:bold;
}


.side_box ul{
padding:5px 15px;
}

.add{
padding:0px 0 5px;
text-align: center;
font-size: 100%;
}

.tel{
text-align:center;
font-weight:bold;
font-size:130%;
line-height: 1.2;
padding:10px 0 10px;
}

.tel span{
font-weight:normal;
font-size:80%;
}

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

.side_box{
width:80%;
margin:10px auto 10px;
}

}

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

.side_box{
width:100%;
margin:10px auto 10px;
}

}

.side_btn{
margin:15px 0;
}

.side_btn li{
margin:10px 0;
text-align:center;
}
/* ----------   フッターナビ  --------------------- */

#page_up{width:62px;
margin:10px auto 0;
text-align:center;
}
#page_up img{width:100%;}


.fotter_bg{
background:#7e4531 url(../common_img/fotter_bg.png) repeat-x 0 0px;
}

.fnav {
width:100%;
margin:10px 0 0 0px;
}

.fnav li{
float:left;
margin:0 20px 5px 0;
color:#303131;
font-weight: bold;
}

.fnav li a:before  { content:'>'; float:left;margin-right:5px;font-size:80%;padding:0px 3px;}

.fnav li a{
display:block;
color:#fff;
}

.fnav li a:hover{
text-decoration:none;
}

.f_link {
    margin: 15px 0 15px;
    text-align: center;
}

.f_link img {
    margin: 10px;
}



#site_copy{
text-align:center;
margin:40px 0 0 0;
padding:10px;
color:#fff;
font-weight: bold;
background:#ff6000;
}

/* ----------   デバイス毎の振り分け  --------------------- */


/*PC960px以上 */

.f_logo p{
	text-align: left;
	font-weight: bold;
	color: #303131;
}


.logo{float:left;width:380px;padding:15px 0px 0px 0px ;}



.h_info{float:right;width:319px;padding:25px 0px 5px 0px ;}
.h_info li{float:left;padding:0px 0px 0px 0px ;}

.f_logo{
padding:15px 0 0;
}

.f_logo p{
color:#fff;
padding:15px 0 0;
}

.f_logo a{
color:#fff;
}

@media only screen and (min-width: 768px) {
.h_info li:nth-child(2){display: none;}
}

/* .h_info li:last-child{float:left;padding:0px 0px 0px 0px ; margin-right: 10px;} */


@media only screen and (max-width: 959px) {}

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


.logo{float:none;width:280px;margin:0px auto 0px ;}

.h_info{float:none;width:120px;margin:0px auto 0px ;padding:10px 0px 0px 0px ;}
.h_info li{float:left;width:45%;text-align:center;}

.h_info li:last-child{display: none;}


.h_info span{display:none;}

.f_logo {
	text-align: center;
	margin: 10px auto;
	width: 80%;
}

.f_logo p{
	text-align: center;
}


h1{
font-size:60%;
padding:0px 0 0px;
line-height:1.3;
text-align:center;
}


#side_bar{display:none;}
#pan {display:none;}

#page_up{width:25%;
margin:0px auto 0;
}
#page_up img{width:100%;}

}

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

.fnav {
margin:0 10px;
}


.fnav li{
float:none;
margin:0 20px 8px 0;
padding-bottom: 5px;
border-bottom: 1px dotted #f2f2f2;
color:#303131;
}


#page_up{width:35%;
margin:0px auto 0;
}
#page_up img{width:100%;}


#site_copy{
margin:0px 0 0 0;
}

}


/* ロールオーバーで不透明度変更
-------------------------------------------------- */
.hover_img a:hover img,
a.hover_img:hover img {
	opacity:0.7;
	filter: alpha(opacity=70);
	-ms-filter: "alpha( opacity=70 )";
	-webkit-transition: opacity linear 0.4s; -moz-transition: opacity linear 0.4s; transition: opacity linear 0.4s;
}


/* タイトルのスタイル
-------------------------------------------------- */

.tt_style01{
background:#ff6000 url(../common_img/h3_bg04.png) no-repeat 10px center;
padding:10px 0px 10px 30px ;
margin:40px 0 25px 0;
font-size:120%;
color:#fff;
font-weight:bold;
}

.tt_style01 span {
	font-size: 85%;
}

main section:first-child .tt_style01{
margin:0px 0 25px 0;
}



.tt_style02{
font-size: 120%;
color: #b8972b;
padding:5px 0 5px 0px;
margin:20px 0px 20px;
font-weight:bold;
border-bottom:dotted 2px #b8972b;
text-align:center;
}

/*
====================================================================================================
◆画像のレフト・ライト
---------------------------------------------------------------------------------------------------- */

.fig_01{
float:right;
width:26%;
margin:0px 0px 20px 20px;
}

.fig_02{
float:left;
width:26%;
margin:0px 20px 20px 0px;
}

.fig_03{
float:right;
width:20%;
margin:0px 0px 20px 20px;
}

.fig_04{
float:left;
width:20%;
margin:0px 20px 20px 0px;
}


.fig_05{
float:right;
width:20%;
margin:0px 0px 20px 20px;
text-align:center;
}

.fig_06{
float:left;
width:20%;
margin:0px 20px 20px 0px;
}

/* 17/8/25 修正　*/
.drone{
margin-top:30px;
}
.fig_07{
float:left;
width:46%;
margin:10px;
}

.fig_08 {
float:left;
width:40%;
margin:0px 20px 20px 0px;
}

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

.fig_01{
float:none;
width:50%;
margin:0px auto 20px;
}

.fig_03{
display:none;
}

.fig_04{
display:none;
}

.drone{
text-align:center;
}
.fig_07{
float:none;
width:50%;
margin:10px auto 20px;
}

.fig_08{
float:none;
width:80%;
margin:10px auto 20px;
}

}
figcaption{
text-align:center;
}



/* ----------   挨拶  --------------------- */
.g_box{
background-color:#fff;
}

.bo_sky{
border:solid 10px #ffb9cf;
}

#kojin {
	border: solid 6px #ff6000;
	background: #fff;
}

ul.kojin{
padding:0px 10px 0px 40px;
}

ul.kojin li{
padding:0px 0px 0px 0px;
text-indent:-30px;
margin:15px 0px;
font-size:130%;
color:#333;
font-weight:bold;
}

/* dl.point dd{
padding:0px 0px 30px 80px; */


ul.kojin li:before {
  content: "";
  display: inline-block;
  width: 1.3em;
  height: 1.3em;
  margin-right: 10px;
  vertical-align: middle;
  background: url(../images/check.png) no-repeat;
  background-size: contain;
}

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

#greet{
padding:10px 0px 10px;
background-color:#fff;
}

#greet h3{
padding:10px 0px 20px 0px;
}


ul.kojin{
padding:0px 5px 0px 40px;
}


ul.kojin li{
padding:0px 0px 0px 0px;
font-size: 100%;
}


}
