/* 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:#fafafa;
}

/* ----------   header  --------------------- */
header {
	padding-bottom:0px;
	background-position: 0 0;
	background-repeat:repeat-x;
	background-image:url(../common_img/bg_header.png);
}


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

article {
	margin:0px 0 10px;
}

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

@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 0 55px;
	padding:0px 0 0px 0;
	min-height:601px;
	background:url(../images/main.png) no-repeat center 0;
}

#main_img .main_inner{
	/* background:rgba(92,141,75,0.8);
	width:390px;
	height:390px;
	border-radius: 50%; */
	margin:0 auto;
}

#main_img h2{
	text-align:center;
	padding:70px 0 10px 0px;
	margin:0px 20px 20px 20px ;
	font-size:300%;
	line-height:1.6;
	font-weight:bold;
	color:#000;
	/* border-bottom:solid 1px #fff; */
	font-family: "游明朝", YuMincho, "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "HG明朝E", "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif;
}


#main_img p{
	color:#fff;
	text-align:center;
	font-size:150%;
	line-height:1.8;
	font-weight:normal;
	font-family: "游明朝", YuMincho, "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "HG明朝E", "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif;
}

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

#main_img .main_inner{
	width:280px;
	height:280px;
}

#main_img h2{
	font-size:140%;
	padding:60px 0 10px 0px;
}

#main_img p{
	font-size:110%;
}

}


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

#main_img {
	margin:0px 0 30px;
	padding:20px 0 0px 0;
	min-height:316px;
	background:url(../images/main.png) no-repeat center 0;
	background-size:800px 316px;
}



}

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


}

.nak_tt{
background:url(../images/main03.png) repeat-x center 0%;
}

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


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

.nak_tt{
margin:0px 0px 0px ;
}

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


}



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

#menu-box{
  margin:10px 0px 0px 0px ;
  padding:10px 0px 10px 0px ;
	background: #F4B5CA;
  position: relative;
}

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


#menu li a{
  display: block;
  padding: 10px 0px 10px;
  color: #fff;
  text-align: center;
  font-weight:bold;
  text-decoration: none;
  border-left:solid 1px #fff;
}
#menu li:last-child a{
  border-left:solid 1px #fff;
  border-right:solid 1px #fff;
}

#menu li a span{
  font-size:220%;
  font-weight:normal;
  color:#fff;
  display:block;
  padding:0px 0px 10px 0px ;
  text-align:center;
}

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

#menu li a:hover span{
  color: #F4B5CA;
}


#toggle{
 display: none;
}


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

#menu-box{
  margin:30px 0px 0px 0px ;
  padding:0px 0px 30px 0px ;
}

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

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


#menu li a span{
display: none;
}

}

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

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

#menu li dd{ top:50px;}


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

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

  #menu li{
    width: 100%;
    background:#fff;
    border-bottom:dotted 1px #ccc;
  }

#menu li a{
  color: #F4B5CA;
  background:none;
}

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


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

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

}





.btn01 {margin:20px auto 15px;width:260px;}

.btn01 a:after { content:'＞'; margin-left:10px;color:#ea81a9;font-size: 100%; }

.btn01 a{
	color:#ea81a9;
	font-weight:bold;
	text-decoration:none;
	font-size:90%;
	display:block;
	padding:15px 0px;
	background:#f2f2f2;
	text-align:center;
	border:solid 4px #ea81a9;
	-webkit-border-radius:80px; -moz-border-radius: 80px; border-radius: 80px;
}

.btn01 a:hover{
	background:#ea81a9;
	color:#fff;
}
.btn01 a:hover:after { content:'＞'; margin-left:30px;color:#fff;font-size: 100%; }

.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;
}



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

.side_box{
border:solid 6px #e3e3e3;
background:#fff;
padding:15px;
}

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

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

.side_box figure{
text-align:center;
}

.side_box figure figcaption{
text-align:center;
padding:10px 0px 0px 0px ;
color:#ea81a9;
font-size: 110%;
font-weight:bold;
}


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

.add{
padding:10px 0 5px;
}

.tel{
text-align:center;
font-weight:bold;
font-size:130%;
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;
}

/* ----------   フッターナビ  --------------------- */

.pagetop {
	display: none;
	position: fixed;
	bottom: 130px;
	right: 2%;
}
.pagetop a {
	display: block;
	width: 47px;
	height: 47px;
	text-align: center;
}


.fotter_bg{
background:url(../common_img/bg_03.png) repeat 0 0;
margin:0px 0px 0px ;
}

.fnav {
width:100%;
margin:0 0px 0px 0px;
padding:0px 0 0 0;
background-color:#ea81a9;
}

.fnav ul{
width:100%;
display:table;
}

.fnav ul li{
text-align:center;
display:table-cell;
padding:15px 0;
}


.fnav ul li a{
color:#fff;
text-align:center;
text-decoration:none;
}


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

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

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


.f_logo {
    float: left;
    width:352px;
    padding:30px 0px 15px 0px ;
    text-align:center;
}


.f_info {
    float:right;
    width:421px;
    padding:40px 0px 15px 0px ;
}
.f_info li{float:left;padding:0px 0px 0px 0px ;}
.f_info li span{padding:0px 0px 0px 0px ;}
.f_info li:last-child{padding:0px 0px 0px 0px ;float:right;}


.link_area{
margin:25px 0 0px;
text-align:center;
}

.link_area img{
margin:5px;
}


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

.fnav ul {
padding:5px 0;
}

.fnav ul li{
display:block;
width:100%;
padding:5px 0;
text-align:center;
}


.f_logo {
    float: none;
    width:280px;
    padding:30px 0px 15px 0px ;
    margin:auto;
}

.f_info {
    float:none;
    width:280px;
    margin:auto;
    padding:0px 0px 15px 0px ;
}

.f_info ul{
    width:100%;
    display:table;
}

.f_info ul li{
    float: none;
    width:33%;
    display:table-cell;
    text-align:center;

}


.f_info span{
    display:none;
}

.f_info li:last-child{float:none;}

}

#site_copy{
text-align:center;
margin:40px 0 0 0;
padding:10px;
color:#503c29;
font-size:120%;
}

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


/*PC960px以上 */


h1{
font-size:90%;
padding:0px 0 0px;
line-height:30px;
font-weight:normal;
color:#fff;
text-align:left;
}

.logo{float:left;width:352px;padding:30px 0px 0px 0px ;}


.h_info{float:right;width:421px;padding:30px 0px 5px 0px ;}
.h_info li{float:left;}
.h_info li:last-child{float:right;width:60px;}

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

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


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

.h_info{float:none;width:165px;margin:15px auto 0px ;padding:0px 0px 0px 0px ;}
.h_info li{width:50px;}
.h_info li:last-child{float:left;width:50px;}
.h_info span{display:none;}



h1{
font-size:60%;
padding:5px 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) {

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

}


/* ロールオーバーで不透明度変更
-------------------------------------------------- */
.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:#009cff url(../common_img/h3_bg01.png) repeat 0px center; */
background-color: #F4B5CA;
padding:13px 0px 13px 30px ;
margin:40px 0 25px 0;
font-size:120%;
color:#fff;
font-weight:bold;
}

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

.tt_style01 span{
padding:0px 0px 0px 20px ;
font-size:90%;
font-weight:normal;
}

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

.tt_style02 span{
font-size: 90%;
padding:0px 0 0px 20px;
color:#333;
}

.tt_style02:before { content:'\e90d'; margin-right:10px;font-family:'icomoon';color:#F4B5CA;font-size: 100%; }


.tt_style03{
font-size: 120%;
color: #fff;
padding:3px 0 3px 10px;
margin:20px 0px 15px;
font-weight:bold;
background:#00baff;
-webkit-border-radius: 3px; -moz-border-radius: 3px; border-radius: 3px;
text-align:left;
}

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


.tt_style04 {
    font-weight: bold;
    padding: 0px 0px 20px 0px;
    font-size: 200%;
    text-align: center;
    margin: 0px 0 20px;
    font-family: "ＭＳ 明朝",sans-serif;
}

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

.tt_style04 {
    font-size: 140%;
    line-height: 1.5;
}

}

/* table_style
-------------------------------------------------- */


.table_style {
 border-top: 1px dotted #333;
 margin:10px auto 10px;
 width:98%;
}

		.table_style th,
		.table_style td {
			padding: 15px;
			border-bottom: 1px dotted #333;
			text-align: left;
		}
		.table_style td {
			background:#fff;
		}
		.table_style td.price{text-align:right;background:#fff;}
		.table_style td.item{font-weight:bold;color:#019e05;text-align:left;width:15%;}

		.table_style th {
			vertical-align: top;
			font-weight:bold;
			color:#333;
			background:#f2f2f2;
			width:25%;
		}
		.table_style th.kou{
			color:#37701b;
			background:#fff;
		}


.table_style02 {
	margin: 20px auto 20px;
	width:100%;
}
	.table_style02 {
		border-top: 1px solid #aaa;
		border-right: 1px solid #aaa;
	}
		.table_style02 th{padding: 10px;
		border-bottom: 1px solid #aaa;
		border-left: 1px solid #aaa;
		background:#f2f2f2;
		font-weight:bold;
		color:#333;
		width:25%;
		}
		.table_style02 td {
			padding: 10px;
			border-bottom: 1px solid #aaa;
			border-left: 1px solid #aaa;
		}
		.table_style02 td.item{
			color:#019e05;
			font-weight:bold;
			width:15%;
		}

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

.res{
display: none;
}

.table_style th{width:100%;
}
.table_style02 th{width:100%;
}
.table_style td.item{width:100%;}
.table_style02 td.item{width:100%;}

table, tbody, tr, th, td {
display: block;
}

}

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

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

.fig_02{
float:left;
width:30%;
margin:0px 30px 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;
}

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

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

.fig_02{
float:none;
width:250px;
margin:0px auto 20px;
}

}
