@charset "utf-8";
@import "common.css";

html {
	width: 100%;
}
body {
	width: 100vw;
	height: auto;
	min-height: 100vh;
	font-size: 15px;
	color: #333;
	background: url(../images/body_bg.jpg) center bottom / contain repeat-x #fff;
}

a {
	color: #389fe8;
}


/* ヘッダ */
header {
	width: 100%;
	background: url(../images/top_logo_bg.jpg) 90% 0 / contain repeat-x;
}
header h1 {
	width: 100%;
	height: 192px;
	max-width: 450px;
    margin-inline: auto;
	background: url('../images/top_logo.png') 50% 50% / contain no-repeat;
	text-indent: -9999px;
}

/* 共通要素:各領域構成 */
#container,
article,
aside {
	width: 100%;
}


/* 共通要素:メインメニュー */
#container aside {
	position: fixed;
	bottom: 0;
	box-shadow: 0 5px 15px 5px rgba(0,0,0,0.6);
	-webkit-box-shadow: 0 5px 15px 5px rgba(0,0,0,0.6);
	-moz-box-shadow: 0 5px 15px 5px rgba(0,0,0,0.6);
}
aside nav {
	width: 100%;
}
	aside nav ul {
		width: 100%;
		display: table;
		background: #f3f1ec;
		}
		aside nav ul li {
			display: table-cell;
			text-align: center;
			vertical-align: middle;
			padding: 0;
			width: 20%;
			}
			aside nav ul li a {
				display: block;
				padding: 28px 0 0;
				height: 45px;
				font-size: 10px;
				color: #333;
				}
/*
aside nav ul li:nth-of-type(1) a {background: url(../images/icon/m_01.png) 50% 3px / 25px no-repeat;}
aside nav ul li:nth-of-type(2) a {background: url(../images/icon/m_02.png) 50% 3px / 25px no-repeat;}
aside nav ul li:nth-of-type(3) a {background: url(../images/icon/m_03.png) 50% 3px / 25px no-repeat;}
aside nav ul li:nth-of-type(4) a {background: url(../images/icon/m_04.png) 50% 3px / 25px no-repeat;}
*/
aside nav ul li:nth-of-type(1) a {background: url(../images/icon/m_01.png) 50% 3px / 25px no-repeat;}
aside nav ul li:nth-of-type(2) a {background: url(../images/icon/m_05.png) 50% 3px / 25px no-repeat;}
aside nav ul li:nth-of-type(3) a {background: url(../images/icon/m_04.png) 50% 3px / 25px no-repeat;}


/* 共通要素:メイン領域 */
article p {
	margin-bottom: 1em;
	line-height: 135%;
}
article h1 {
	width: 100%;
	padding: 8px 10px 5px 10px;
	background: #f78016;
	color: #fff;
	font-size: 18px;
}
article h2 {
	width: 100%;
	padding: 8px 10px 5px 10px;
	background: #ecece3;
	font-size: 14px;
}

/* index */
#top_menu {
	margin-bottom: 1px;
}
#top_menu h2{
	margin-bottom: 1px;
	font-size: 15px;
	font-weight: bold;
	padding: 7px 10px 4px;
	letter-spacing: 5px;
	text-align: center;
	color:#fff;
	background: #f78016;
}
#top_menu ul{
	display: block;
	overflow: hidden;
}
	#top_menu ul li{
		float: left;
		width: 50%;
		}
/*
	#top_menu ul li:nth-of-type(1){background: #6bb907;}
	#top_menu ul li:nth-of-type(2){background: #55b302;}
	#top_menu ul li:nth-of-type(3){background: #55b302;}
	#top_menu ul li:nth-of-type(4){background: #6bb907;}
	#top_menu ul li:nth-of-type(5){background: #6bb907;}
	#top_menu ul li:nth-of-type(6){background: #55b302;}
*/

	#top_menu ul li:nth-of-type(1){background: #fd9d9d;}
	#top_menu ul li:nth-of-type(2){background: #f7c83b;}
	#top_menu ul li:nth-of-type(3){background: #b5a9e6;}
	#top_menu ul li:nth-of-type(4){background: #89ca79;}
	#top_menu ul li:nth-of-type(5){background: #8bbff7;}
	#top_menu ul li:nth-of-type(6){background: #62c1b3;}

		#top_menu ul li a{
			width: 100%;
			height: 134px;
			display: table;
			text-align: center;
			color: #333;
			font-size: 16px;
			line-height: 1.2em;
			padding-top: 95px;
			}
			#top_menu ul li a span{

				}
#top_menu ul li:nth-of-type(1) a{background: url(../images/touhoku1.png) 50% 17px / 70px no-repeat;}
#top_menu ul li:nth-of-type(2) a{background: url(../images/touhoku2.png) 50% 17px / 70px no-repeat;}
#top_menu ul li:nth-of-type(3) a{background: url(../images/touhoku3.png) 50% 17px / 70px no-repeat;}
#top_menu ul li:nth-of-type(4) a{background: url(../images/touhoku4.png) 50% 17px / 70px no-repeat;}
#top_menu ul li:nth-of-type(5) a{background: url(../images/touhoku5.png) 50% 17px / 70px no-repeat;}
#top_menu ul li:nth-of-type(6) a{background: url(../images/touhoku6.png) 50% 17px / 70px no-repeat;}



/* index以外共通 */
h1#c_title01{background: #80bf2b;}
h1#c_title02{background: #40b74f;}
h1#c_title03{background: #5aa579;}
h1#c_title04{background: #1ba26a;}
h1#b_title01{background: #389fe8;}
h1#b_title02{background: #2e8be2;}
h1#b_title03{background: #3390c5;}
h1#b_title04{background: #4f74c7;}
h1#b_title05{background: #8d77b9;}
h1#b_title06{background: #6962a2;}

#container > article {
	position: relative;
}
#container > article h1 {
	margin-bottom: 1px;
	text-align: center;
}
#container > article > a{
	position: absolute;
	top: 0;
	display: block;
	padding: 0 10px;
	background: url(../images/icon/arrow_l_w.png) left 8px center / 20px no-repeat rgba(0, 0, 0, 0.14);
	text-indent: -9999px;
	width: 34px;
	height: 31px;
}
#container > article > p {
	padding: 1em;
}


/* cbselect */
#container #c_menu {
	margin-bottom: 1px;
}
#container #b_menu {
}
#container #c_menu h2,
#container #b_menu h2 {
	margin-bottom: 1px;
	font-size: 15px;
	font-weight: bold;
	padding: 7px 10px 5px;
	letter-spacing: 5px;
	text-align: center;
	color:#fff;
}
#container #c_menu h2{background: #308c0b;}
#container #b_menu h2{background: #0c70ad;}

#container #c_menu ul,
#container #b_menu ul {
	display: block;
	overflow: hidden;
}
	#container #c_menu ul li,
	#container #b_menu ul li {
		float: left;
		width: 50%;
		}
#container #c_menu ul li:nth-of-type(1){background: #80bf2b;}
#container #c_menu ul li:nth-of-type(2){background: #40b74f;}
#container #c_menu ul li:nth-of-type(3){background: #5aa579;}
#container #c_menu ul li:nth-of-type(4){background: #1ba26a;}
#container #b_menu ul li:nth-of-type(1){background: #389fe8;}
#container #b_menu ul li:nth-of-type(2){background: #2e8be2;}
#container #b_menu ul li:nth-of-type(3){background: #3390c5;}
#container #b_menu ul li:nth-of-type(4){background: #4f74c7;}
#container #b_menu ul li:nth-of-type(5){background: #8d77b9;}
#container #b_menu ul li:nth-of-type(6){background: #6962a2;}

		#container #c_menu ul li a,
		#container #b_menu ul li a {
			width: 100%;
			height: 113px;
			display: table;
			text-align: center;
			color: #fff;
			font-size: 13px;
			line-height: 1.2em;
			padding-top: 35px;
			}
			#container #c_menu ul li a span,
			#container #b_menu ul li a span {
				display: table-cell;
				vertical-align: middle;
				}

#container #c_menu ul li:nth-of-type(1) a{background: url(../images/icon/c_01.png) 50% 22px / 35px no-repeat;}
#container #c_menu ul li:nth-of-type(2) a{background: url(../images/icon/c_02.png) 50% 22px / 35px no-repeat;}
#container #c_menu ul li:nth-of-type(3) a{background: url(../images/icon/c_03.png) 50% 22px / 35px no-repeat;}
#container #c_menu ul li:nth-of-type(4) a{background: url(../images/icon/c_04.png) 50% 22px / 35px no-repeat;}
#container #b_menu ul li:nth-of-type(1) a{background: url(../images/icon/b_01.png) 50% 22px / 35px no-repeat;}
#container #b_menu ul li:nth-of-type(2) a{background: url(../images/icon/b_02.png) 50% 22px / 35px no-repeat;}
#container #b_menu ul li:nth-of-type(3) a{background: url(../images/icon/b_03.png) 50% 22px / 35px no-repeat;}
#container #b_menu ul li:nth-of-type(4) a{background: url(../images/icon/b_04.png) 50% 22px / 35px no-repeat;}
#container #b_menu ul li:nth-of-type(5) a{background: url(../images/icon/b_05.png) 50% 22px / 35px no-repeat;}
#container #b_menu ul li:nth-of-type(6) a{background: url(../images/icon/b_06.png) 50% 22px / 35px no-repeat;}



/* select_list */
#container #select_list{
	background: #fff;
}

#container #select_list section ul{
}
	#container #select_list section ul li{
		border-bottom: 1px solid #ececec;
		}
		#container #select_list section ul li a{
			display: block;
			padding: 11px 5px 8px 20px;
			color: #333;
			font-size: 13px;
			background: url(../images/icon/arrow_r_g.png) right 15px center / 15px no-repeat;
			}
			#container #select_list section ul li a.selected{
				color: #f78016;
				}
		#container #select_list section ul li label{
			display: block;
			padding: 8px 5px 5px 20px;
			color: #333;
			font-size: 13px;
			}

input[type="checkbox"] {
	border: 2px solid #ecece3;
	vertical-align: -8px;
	-webkit-appearance: none;
	position: relative;
	margin-right: 5px;
	-webkit-border-radius: 3px;
	border-radius: 5px;
	-webkit-box-sizing: border-box;
	width: 24px;
	height: 24px;
	background: url(../images/icon/checkbox.png) center / 15px no-repeat #fff;
}
	input[type="checkbox"]:checked {
		border: 2px solid #f78016;
		background: url(../images/icon/checkbox_checked.png) center / 15px no-repeat #fff;
		}
	input[type="checkbox"]:checked + span{
		color: #f78016;
		}

input[type="radio"] {
	border: 2px solid #ecece3;
	vertical-align: -8px;
	-webkit-appearance: none;
	position: relative;
	margin-right: 5px;
	-webkit-border-radius: 3px;
	border-radius: 20px;
	-webkit-box-sizing: border-box;
	width: 24px;
	height: 24px;
	background: url(../images/icon/radio.png) center / 14px no-repeat #fff;
}
	input[type="radio"]:checked {
		border: 2px solid #f78016;
		background: url(../images/icon/radio_checked.png) center / 14px no-repeat #fff;
		}
	input[type="radio"]:checked + span{
		color: #f78016;
		}

select{
	padding: 8px;
	margin: 2px 0;
	font-size: 16px;
	transform: scale(0.8);
	width: 45%;
	border: 1px solid #ececec;
	-webkit-appearance: none;
	-moz-appearance: none;
	appearance: none;
	background: url(../images/icon/arrow_b_g.png) right 15px center / 18px no-repeat;	
}
	select [option]:selected{
		color: #f78016;	
		}

#decision{
	padding: 47px 0 0;
}
	#decision div{
		display: block;
		overflow: hidden;
		position: fixed;
		bottom: 0;
		width: 100%;
		padding: 5px;
		background: rgba(0,0,0,0.6);
	}
/*
		#decision div a:nth-of-type(1){
			float: left;
			padding: 5px 30px 3px;
			background: #fff;
			border-radius: 4px;
			font-weight: bold;
			border: solid 3px #8cc3ea;
			color: #2b6a96;
		}
		#decision div a:nth-of-type(2){
*/
		#decision div a {
			float: right;
			padding: 5px 60px 3px;
			background: #f78016;
			border-radius: 4px;
			font-weight: bold;
			border: solid 3px #f7c69a;
			color: #fff;
		}


/* clist, blist */
#cblist{
	background: #fff;
	padding-bottom: 15px;
}
#cblist h2{
	margin-bottom: 5px;
	border-left: solid 5px #f78016;
	background: #f7f7f7;
	font-weight: bold;
}
#cblist > button{
	display: block;
	padding: 0 10px;
	background: url(../images/icon/arrow_l_g.png) left 8px center / 20px no-repeat;
	text-indent: -9999px;
	width: 31px;
	height: 31px;
	margin-top: -31px;
	margin-bottom: 8px;
	border: none;
}
#total_num {
	width: 100%;
	padding: 8px 10px 5px 10px;
	font-size: 18px;
	font-weight: bold;
	color: #6b6550;
	text-align: center;
	background: #fbf6ce;
	margin: 0;
	line-height: 1em;
}
#order_select select{
	width: 60%;
}
#order_select button{
	padding: 7px 30px 5px;
	background: #f78016;
	border-radius: 4px;
	font-weight: bold;
	border: none;
	color: #fff;
}

#cblist a.cblist_link {
	display: block;
	width: auto;
	border-top: solid 1px #e6e5d8;
	color: #333;
	background: url(../images/icon/arrow_r_g.png) right 6px bottom 40px / 20px no-repeat;
}
#cblist a.cblist_link:last-of-type {
	border-bottom:  solid 1px #e6e5d8;
}

#cblist a.cblist_link > p {
	font-size: 13px;
	line-height: 120%;
	padding: 5px;
	text-align: center;
	color: #7b5701;
	font-weight: bold;
	margin: 0 0 5px 0;
}
#cblist a.cblist_link div.cblist_tbl {
	display: table;
	width: 90%;
	margin: 0 0 10px 10px;
}
#cblist a.cblist_link div.cblist_tbl > div {
	display: table-cell;
	vertical-align: middle;
}
#cblist a.cblist_link div.cblist_tbl > div.cblist_photo {
	width: 120px;
}
#cblist a.cblist_link div.cblist_tbl > div.cblist_photo img {
	width: 90%;

}
#cblist a.cblist_link div.cblist_tbl > div dl {
	display: table;
	width: 100%;
	border-bottom: 1px #e6e5d8 dashed;
}
#cblist a.cblist_link div.cblist_tbl > div dl:last-of-type {
	border: none;
}

#cblist a.cblist_link div.cblist_tbl > div dl dt,
#cblist a.cblist_link div.cblist_tbl > div dl dd {
	display: table-cell;
	vertical-align: middle;
	padding: 3px 0;
	font-size: 12px;
}
#cblist a.cblist_link div.cblist_tbl > div dl dt {
	width: 30%;
}


/* meisai */
#meisai { }

#meisai h1{
	text-align: center;
	font-size: 18px;
	font-weight: bold;
	padding: 10px 30px 8px;
}
#meisai p {
	margin-bottom: 10px;
	font-size: 12px;
}

#meisai_photo,
#meisai_moviebox {
	width: 100%;
	margin-bottom: 10px;
}
#meisai_moviebox button {
	display: block;
	width: 90%;
	margin: 10px auto;
	padding: 8px 0;
	background: #f00;
	border: solid 2px #666;
	-webkit-border-radius: 5px;
	-moz-border-radius: 5px;
	border-radius: 5px;
	color: #fff;
	font-size: 16px;
}
#meisai_photo {
	width: 280px;
	margin: 0 auto;
}
#meisai_photo img {
	width: 280px;
	height: 210px;
}

#map {
	width: 100%;
	height: 300px;
}

#meisai_body {
	width: 100%;
	background: #fff;
	font-size: 13px;
	border: solid 5px #fff;
}
#meisai_body th,
#meisai_body td {
	padding: 7px;
	border-bottom: solid 1px #e6e4de;
}
#meisai_body th {
	width: 20%;
	background: #f5f4f2;
	text-align: left;
}
#meisai_body td {
	width: 80%;
}
#meisai_body td button {
	width: 100%;
	margin-top: 5px;
	padding: 5px 0;
	border: solid 1px #666;
	border-radius: 6px;
	background: linear-gradient(to bottom,  #ffffff 0%,#eeeeee 100%);
	font-size: 12px;
}
#meisai_body td iframe {
	width: 100%;
	border: 0 none;
}



/* お気に入り */
/*
#container .okiniiri h1{
	text-align: center;
}
#container .okiniiri > a:first-of-type{
	display: block;
	padding: 0 10px;
	background: url(../images/icon/arrow_l_w.png) left 8px center / 20px no-repeat rgba(0, 0, 0, 0.14);
	text-indent: -9999px;
	width: 34px;
	height: 31px;
	margin-top: -31px;
}
#container .okiniiri > div:first-of-type{
	width: 100%;
	padding: 8px 15px;
	font-size: 16px;
	font-weight: bold;
	color: #6b6550;
	background: #fbf6ce;
	margin: 0;
	line-height: 1em;
	overflow: hidden;
}
	#container .okiniiri > div p{
		float: left;
		margin: 8px 15px 0 0;
		}
	#container .okiniiri > div button {
		padding: 7px 30px 5px;
		background: #f78016;
		border-radius: 4px;
		font-weight: bold;
		border: none;
		color: #fff;
		float: right;
		}
	#container .okiniiri > a{
		clear: both;
		overflow: hidden;
		}
		#container .okiniiri > a > label {
			border-right: 1px #e6e5d8 dashed;
			float: left;
			padding: 60px 3px;
			margin: 0 5px 5px;
			}
		#container .okiniiri > a > p {
			padding: 5px 5px 0 0;
			}
		#container .okiniiri > a.cblist_link > div.cblist_tbl {
			width: 80%;
			}

#container #meisai .okiniiri{
	height: 76px;
	text-align: center;
	background: #efc429;
}
	#container #meisai .okiniiri button{
		margin: 20px 0;
		width: 97%;
		padding: 4px;
		border-radius: 4px;
		font-weight: bold;
		border: none;
		background: #fff;
		}
		#container #meisai .okiniiri button span{
			color: #f78016;
			font-size: 17px;
			background: url(../images/icon/okiniiri.png) 0 50% / 25px no-repeat;
			padding: 6px 0px 4px 30px;
			display: inline-block;
			line-height: 1em;
			}
*/


/* 利用上の注意・プライバシーポリシー・運営会社 */
/*
#container #other h1{
	text-align: center;
}
#container #other > a{
	display: block;
	padding: 0 10px;
	background: url(../images/icon/arrow_l_w.png) left 8px center / 20px no-repeat rgba(0, 0, 0, 0.14);
	text-indent: -9999px;
	width: 34px;
	height: 31px;
	margin-top: -31px;
}
*/
#container #other section p {
	font-size: 13px;
	padding: 0px;
	margin: 15px;
}
#container #other section ul li {
	font-size: 13px;
	list-style: disc;
	padding: 0px;
	margin: 10px 10px 10px 30px;
	line-height: 1.4em;
}
#container #other section ul.other_top li{
	display: block;
	margin: 0;
	color: #333;
	font-size: 13px;
	list-style: none;
	border-bottom: 1px solid #ececec;
}
//	#container #other section ul.other_top li:last-of-type{
//		padding: 10px 10px 10px 20px;
//		}
	#container #other section ul.other_top li a{
		display: block;
		color: #333;
		font-size: 13px;
		background: url(../images/icon/arrow_r_g.png) right 15px center / 15px no-repeat;
		list-style: none;
		padding: 10px 10px 10px 20px;
		}

#container #other section ol li {
	font-size: 13px;
	list-style: decimal;
	padding: 0px;
	margin: 10px 10px 10px 30px;
	line-height: 1.4em;
}
#container #other section dl {
	margin: 10px;
	font-size: 14px;
}
	#container #other section dl dt{
		margin: 0;
		color: #e89f5e;
		font-weight: bold;
		}
	#container #other section dl dd{
		margin: 0 0 10px;
		padding-bottom: 5px;
		border-bottom: 1px dashed #ece8e3;
		}


/* contact */
#contact {
	background: #fff;
	padding: 0;
}

#contact h2{
	padding: 0;
	display: table;
}
#contact h2 span{
	display: table-cell;
	width: 20%;
	text-align: center;
	background: #baded7;
	color: #fff;
	padding: 8px 5px 6px;
	font-weight: bold;
}
#contact h2 span.h2_active{
	background: #4ead9b;
}

#contact section > p{
	padding: 10px;
	margin: 0;
}

#contact dl{
}
#contact dl dt{
	background: #f5f0e6;
	font-weight: bold;
	padding: 3px 10px 3px;
	margin: 0 0 5px;
}
#contact dl dt span{
	color: #fff;
	font-size: 12px;
	background: #ea3e3e;
	padding: 0 7px;
	display: inline-block;
	margin: 0 5px;
	border-radius: 4px;
	text-align: center;
}
#contact dl dt em{
	color: #4ead9b;
	font-size: 17px;
	display: inline-block;
	margin: 3px 3px 0 0;
	font-style: normal;
}

#contact dl dd{
	padding: 5px 15px 10px;
}
#contact dl dd ul li{
	list-style: none;
	margin-bottom: 7px;
}
#contact dl dd ul li span{
	display: inline-block;
	background: none;
	margin: 0;
	padding: 0;
}
#contact dl dd p{
	font-size: 12px;
	margin-top: 5px;
}
#contact dl dd p span{
	display: block;
	font-weight: bold;
	color: #337fb7;
	font-size: 15px;
	margin: 8px 0 3px;
	background: #fbf6ce;
	padding: 4px;
}
#contact dl dd span{
	display: block;
	background: #f5f4f2;
	margin-bottom: 2px;
	padding: 6px 5px;
}
#contact dl dd em {
	display: block;
	margin-bottom: 4px;
	padding: 4px;
	background: #ffd6d6;
	color: #f00;
	font-size: 12px;
	font-style: normal;
}

#contact dl input[type='text'],
#contact dl input[type='tel'],
#contact dl input[type='email'],
#contact dl select,
#contact dl textarea {
	padding: 4px;
	font-size: 15px;
	border-radius: 4px;
	border: 1px solid #ccc;
	transform: none;
	margin: 0;
	width: auto;
}

#contact dl input[type='text'] {
	width: 48%;
}
#contact dl input[type='text']:nth-of-type(3),
#contact dl input[type='text']:nth-of-type(4){
	margin-top: 5px;
}
#contact dl input[type='tel'] {
}
#contact dl input[type='email'] {
	width: 100%;
}
#contact dl input.iserror {
	background: #fff2f2;
	border-color: #fcc;
}

#contact dl select {
	padding-right: 45px;
	background: url(../images/icon/arrow_b_g.png) right 10px center / 18px no-repeat;
}

#contact dl textarea {
	height: 5em;
	line-height: 125%;
	width: 100%;
}

#contact .button_box{
	background: #ffd985;
	margin: 15px auto 0;
	padding: 15px 0;
	border-radius: 8px;
	text-align: center;
}
#contact .button_box button {
	padding: 5px;
	font-size: 18px;
}

#contact div div{
	overflow: hidden;
	border-radius: 8px;
	margin: 0 15px 10px;
	background: #f5f4f2;
}
#contact div div dl{
	display: table;
	width: 100%;
	border-bottom: solid 1px #fff;
}
#contact div div dl dt{
	display: table-cell;
	width: 30%;
	padding: 8px 0;
	background: #e8e7e3;
	font-size: 12px;
	text-align: center;
	vertical-align: middle;
}
#contact div div dl dd{
	display: table-cell;
	width: 70%;
	padding-left: 4px;
	background: #f5f4f2;
	word-wrap: break-word;
	line-height: 1em;
	vertical-align: middle;
}



/* その他 */
.clear:before,
.clear:after {
	content: " ";
	display: table;
}
.clear:after {
	clear: both;
}
.clear {
	*zoom: 1;
}

.img {
	font-size: 1em;
	line-height: 100%;
	text-indent: -9999px;
}

.fleft {
	float: left;
}
.fright {
	float: right;
}

.left {
	text-align: left;
}
.center {
	text-align: center;
}
.right {
	text-align: right;
}

.bold {
	font-weight: bold;
}
.normal {
	font-weight: normal;
}

.small01 {
	font-size: 0.6em;
}
.small02 {
	font-size: 0.7em;
}
.large01 {
	font-size: 1.1em;
}
.large02 {
	font-size: 1.2em;
}

.red {
	color: #f00;
}

.pink {
	color: #eb6877;
}

.ai {
	color: #039;
}
.green {
	color: #01844B;}
.gray {
	color: #666;
}
.black {
	color: #000;
}

.udl {
	text-decoration: underline;
}


.imeon {
	ime-mode: active;
}
.imeoff {
	ime-mode: inactive;
}
.imenone {
	ime-mode: disabled;
}
