@charset "utf-8";

/* --------------
 reset
-------------- */
body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,code,form,fieldset,legend,input,textarea,p,blockquote,th,td{margin:0;padding:0}
ol,ul{list-style:none}
caption,th{text-align:left}

img {max-width:100% !important; height:auto;vertical-align: bottom;}
iframe {max-width:100% !important; border:0;}

input[type="submit"],label {
	cursor: pointer;
}

/* --------------
 clearfix
-------------- */
div:after,ul:after,ol:after,dl:after,
header:after,footer:after,
nav:after,section:after,article:after {
	content: ""; 
	display: block;
	clear: both;
}

/* --------------
 base
-------------- */
html {
	background: #EDEDED;
	-webkit-text-size-adjust:none;/* for smartphone */
}
body {
	/*color: #222;*/
	/*color: #111 !important;*/
	font: normal 14px/1.6 メイリオ, Meiryo, 'ヒラギノ角ゴ Pro W3', 'Hiragino Kaku Gothic Pro', 'ＭＳ Ｐゴシック', sans-serif;
	/*background: url(../../img/hd_bg.jpg) no-repeat !important;*/
}

h1,h2,h3,h4,h5,h6 {
	line-height: 1.2;
	font-weight: normal;
	font-size: 100%;
}
	
/* link */
a {
	color: #15579E;
	text-decoration: none;
	word-break: break-all;
  transition: all .3s 0s ease;
}
a:hover {
	color: #000;
	text-decoration: underline;
  transition: all .1s 0s ease;
}
a:hover img {
	-moz-opacity:0.8;
	opacity:0.8;
}

/* --------------
 modules css
-------------- */
/* ---------- font weight */
.bold {	font-weight: bold;}

/* ---------- align */
.alc { text-align: center !important;}
.alr { text-align: right !important;}
.all { text-align: left !important;}

.alt { vertical-align: top !important;}
.alb { text-align: bottom !important;}

/* ---------- float */
.noFloat { float: none !important;}

/* ---------- Cancele */
.both, .clear { clear: both;}

/* ---------- margin,padding */
.mb0 {	margin-bottom: 0px !important;}
.mb5 {	margin-bottom: 5px !important;}
.mb10 {	margin-bottom: 10px !important;}
.mb15 {	margin-bottom: 15px !important;}
.mb20 {	margin-bottom: 20px !important;}
.mb25 {	margin-bottom: 25px !important;}
.mb30 {	margin-bottom: 30px !important;}
.mb35 {	margin-bottom: 35px !important;}
.mb40 {	margin-bottom: 40px !important;}
.mb45 {	margin-bottom: 45px !important;}
.mb50 {	margin-bottom: 50px !important;}
.mb55 {	margin-bottom: 55px !important;}
.mb60 {	margin-bottom: 60px !important;}
.mb70 {	margin-bottom: 70px !important;}
.mb80 {	margin-bottom: 80px !important;}
.mb90 {	margin-bottom: 90px !important;}
.mb100 {margin-bottom: 100px !important;}

.ml0 {	margin-left: 0px !important;}
.ml5 {	margin-left: 5px !important;}
.ml10 {	margin-left: 10px !important;}
.ml20 {	margin-left: 20px !important;}
.ml30 {	margin-left: 30px !important;}
.ml50 {	margin-left: 50px !important;}
.ml200 {	margin-left: 200px !important;}

.mr0 {	margin-right: 0px !important;}
.mr5 {	margin-right: 5px !important;}
.mr10 {	margin-right: 10px !important;}
.mr20 {	margin-right: 20px !important;}
.mr30 {	margin-right: 30px !important;}

.mt0 {	margin-top: 0px !important;}
.mt5 {	margin-top: 5px !important;}
.mt10 {	margin-top: 10px !important;}
.mt20 {	margin-top: 20px !important;}
.mt30 {	margin-top: 30px !important;}

.pb0 {	padding-bottom: 0px !important;}
.pb5 {	padding-bottom: 5px !important;}
.pb10 {	padding-bottom: 10px !important;}
.pb20 {	padding-bottom: 20px !important;}
.pb30 {	padding-bottom: 30px !important;}

.pt0 {	padding-top: 0px !important;}
.pt5 {	padding-top: 5px !important;}
.pt10 {	padding-top: 10px !important;}
.pt20 {	padding-top: 20px !important;}
.pt30 {	padding-top: 30px !important;}

.pl0 {	padding-left: 0px !important;}
.pl5 {	padding-left: 5px !important;}
.pl10 {	padding-left: 10px !important;}
.pl20 {	padding-left: 20px !important;}
.pl30 {	padding-left: 30px !important;}

.pr0 {	padding-right: 0px !important;}
.pr5 {	padding-right: 5px !important;}
.pr10 {	padding-right: 10px !important;}
.pr20 {	padding-right: 20px !important;}
.pr30 {	padding-right: 30px !important;}

/* ---------- font size */
.fs10 { font-size:77%;}
.fs11 { font-size:85%;}
.fs12 { font-size:93%;}
.fs13 { font-size:100%;}
.fs14 { font-size:108%;}
.fs15 { font-size:116%;}
.fs16 { font-size:123.1%;}
.fs17 { font-size:131%;}
.fs18 { font-size:138.5%;}
.fs19 { font-size:146.5%;}
.fs20 { font-size:153.9%;}
.fs21 { font-size:161.6%;}
.fs22 { font-size:167%;}
.fs23 { font-size:174%;}
.fs24 { font-size:182%;}
.fs25 { font-size:192.3%;}
.fs26 { font-size:197%;}
.fs30 { font-size:227.3%;}

/* ---------- float */
.fll { float: left;}
.flr { float: right;}
.flc { margin-left: auto; margin-right: auto; }

/* ---------- width */
.wd1 {width: 1% !important;}
.wd2 {width: 2% !important;}
.wd3 {width: 3% !important;}
.wd4 {width: 4% !important;}
.wd5 {width: 5% !important;}
.wd6 {width: 6% !important;}
.wd7 {width: 7% !important;}
.wd8 {width: 8% !important;}
.wd9 {width: 9% !important;}
.wd10 {width: 10% !important;}
.wd15 {width: 15% !important;}
.wd20 {width: 20% !important;}
.wd25 {width: 25% !important;}
.wd30 {width: 30% !important;}
.wd35 {width: 35% !important;}
.wd40 {width: 40% !important;}
.wd45 {width: 45% !important;}
.wd50 {width: 50% !important;}
.wd55 {width: 55% !important;}
.wd60 {width: 60% !important;}
.wd65 {width: 65% !important;}
.wd70 {width: 70% !important;}
.wd75 {width: 75% !important;}
.wd80 {width: 80% !important;}
.wd85 {width: 85% !important;}
.wd90 {width: 90% !important;}
.wd95 {width: 95% !important;}
.wd100 {width: 100% !important;}

.mwd1300 {min-width: 1300px;}
.mwd1040 {min-width: 1040px;}
.mwd1080 {min-width: 1080px;}


.wd1000 { max-width: 1000px; }
.wd1200 { max-width: 1200px; }
.wd1500 { max-width: 1500px; }

/* ----- images */
.imgL {
	float: left;
	margin-right: 10px;
	margin-bottom: 10px;
}
.imgR {
	float: right;
	margin-left: 10px;
	margin-bottom: 10px;
}

/* ----- text */
.txtS {
	color: #666;
	font-size: 85%;
}

/* error message */	
.mymsg {
	color:#F630A0;
	font-weight: bold;
	font-size:90%;
}

/* ----- color */
.blue {color:#00F;}
.red {color:#F00;}



.clRed{ color: #EB272B }
.clBlue{ color: #2348D5 }
.clGrn{ color: #408B42 }
.clYlw{ color: #a7ab0a }
.clPink{ color: #E7698C }
.clSBlue{ color: #1AB6C9 }
.clLGrn{ color: #48BB26 }
.clOg{ color: #DD7610 }
.clPpl{ color: #9a1cd8 }
.clGray{ color: #aaa }
.uLine{ text-decoration: underline }
.lThrough{ text-decoration: line-through }



/* ----- list */
.ulDisc {
	margin-left: 22px;
	line-height: 1.4;
	list-style: outside disc;
}

.olDecimal {
	margin-left: 22px;
	list-style: outside decimal;
}

.ulDisc li, .olDecimal li {
	margin-bottom: 10px;
}

/* ----- button */
.btnS {
	/*padding: 3px 3px;*/
	color: #EEE;
	font-size: 95%;
	border-radius: 3px;
	background: #999;
}
.btnS a {
	display: inline-block;
	padding: 1px 10px;
	color: #EEE !important;
	font-size: 90%;
	border-radius: 3px;
	background: #999;
	vertical-align: middle;
	box-shadow: 0 -2px 0 rgba(0,0,0,.25) inset;
}
.btnS a:hover {
	text-decoration: none;
	background: #aaa !important;
}


.btnA {
	display: inline-block;
	margin: 3px 0;
	padding: .3em .5em;
	border-radius: 3px;
	border: #fff solid 1px;
	color: #fff;
	text-decoration: none;
	background: #6c8ab1;
	box-shadow: 0 -2px 0 rgba(0,0,0,.25) inset;
	word-break: keep-all !important;
	white-space: nowrap !important;
	vertical-align: middle;
}

.btnA.og {
	background: #EB7D44;
}
.btnA.grn {
	background: #57AC5E;
}
.btnA.red {
	background: #dc143c;
}
.btnA.blue {
	background: #0000ff;
}
.btnA.pink {
	background: #e85255;
}
.btnA.sort {
	padding: .1em .3em;
	line-height: 1;
	background: #888;
	font-size: .8em;
}


.btnA:hover {
	color: #fff;
	opacity: .7;
	text-decoration: none;
}

.btnB {
	display: inline-block;
	margin: 3px 0;
	padding: .3em .2em !important;
	border-radius: 3px;
	border: #ccc solid 1px;
	color: #fff;
	text-decoration: none;
	background: #6c8ab1;
	box-shadow: 0 -2px 0 rgba(0,0,0,.25) inset;
	word-break: keep-all !important;
	white-space: nowrap !important;
	vertical-align: middle;
}

.btnB:hover {
	color: #fff;
	opacity: .5;
	text-decoration: none;
}

/* ----- form */
label{ display:inline-block; }
.imeDis {	ime-mode: disabled; }

/* ----- table */
.tblA th,.tblA td {
	padding: 3px;
}

/* ----- base width */
body {
	width: 100%;
	/*min-width: 1000px;*/
	min-width: 768px;
}

/* --------------
 common
-------------- */

/* =header
-------------------------------------------------------------- **/
#header {
	width: 100%;
	/*min-width: 1000px;*/
	height: 32px;
	color: #FFF;
	background: #534741;
}

/* =siteHeader
---------------------------------------------------- */
#siteHeader {
	padding: 5px;
}

#siteHeader h1 {
	float: left;
	width: 50%;
	margin-top: 3px;
}
#siteHeader p {
	float: right;
	/*width: 50%;*/
	font-size: 90%;
	text-align: right;
}
#siteHeader a {
	color: #44DDF0;
}

/* =container
-------------------------------------------------------------- **/
.container {
	/*min-height: 1000px;*/
	min-height: 1000px ;
	min-height: -webkit-calc(100vh - 60px) ;
	min-height: calc(100vh - 60px) ;
	/*overflow: hidden;*/
	
	position: relative;
	background:#e6e6fa;
}

/* =main
---------------------------------------------------- */
.main {
/*	float: left;
	width: 83%;*/
	padding: 20px 1%;
/*	max-width: 1200px;*/
	margin-left: 150px;
/*	margin-left: 170px;*/
}

/* =headline / titles
------------------------------------------ */
.pageHeader {
	margin-bottom: 10px;
	padding: 10px 20px 5px;
	/*background: #FFF;*/
	background: rgba(255,255,255,0.8);
}
.pageHeader h2 {
	color: #534741;
	font-size: 120%;
	font-weight: bold;
	display: inline-block;
}

/* =breadcrumb
-------------------------------- */
.breadcrumb {
	display: inline-block;
	margin-left: 40px;
}
.breadcrumb li {
	color: #333;
	font-size: 12px;
	display: inline-table;
}
.breadcrumb li a {
	color: #666;
	padding-right: 5px;
}
.breadcrumb li a:after {
	content: "　>"; 
}
.breadcrumb li a:hover {
	color: #333;
}

/* ---------- */
.ulAlc {
	clear: both;
	margin-top: 10px;
	padding-top: 10px;
	text-align: center;
	border-top: 1px solid #CCC;
}
.ulAlc li {
	display: inline-block;
}

/* =contents
------------------------------------------ */
.contents {
	/* width: 100%;
	min-width: 1000px; */
	/*padding: 10px 0;*/
	/* overflow-x: auto;
	overflow-y: hidden; */
}


.contents h2 {
	margin: auto;
	margin-bottom: 20px;
	padding: 10px 5px;
	border: 5px solid #fff;
	border-top: 5px double #81aba1;
	border-bottom: 5px double #81aba1;
	font-size: 1.3em;
	font-weight: bold;
	background: #fff;
	text-align: center;
	max-width: 1000px;
}


/* =clmSearch
-------------------------------- */
.clmSearch {
	margin-bottom: 15px;
	font-size: 90%;
}
.clmSearch fieldset {
	padding: 10px;
	border: 1px solid #71999E;
}
.clmSearch legend {
	padding: 0 5px;
	color: #71999E;
	background: #EDEDED;
}
.clmSearch input {
	padding: 2px;
}
.clmSearch .message {
	margin-top: 10px;
}
.clmSearch .message span {
	display: inline-block;
	padding: .1em .5em;
	border-radius: 5px;
	background: #F8F3B6;
}

.ulSch {
	letter-spacing: -0.40em;
}
.ulSch li {
	padding: 3px 20px 3px 3px;
	display: inline-block;
	letter-spacing: normal;
}
.btnSubmit {
/*	margin-left: 10px;*/
}
.btnSubmit input,
.btnSubmit .botan {
	margin: 5px;
	padding: .4em 1.0em;
	color: #FFF;
	/*border: 1px outset #FFF;*/
	border-radius: 3px;
	background: #71999E;
	
	border: 0;
	box-shadow: 0 -2px 0 rgba(0,0,0,.25) inset;
}

.btnSubmit input.pink,
.btnSubmit .botan.pink {
	background: #e85255;
}

.btnSubmit input:hover,
.btnSubmit .botan:hover {
	/*background: #5fa3ab;*/
	opacity: .7;
}

/* =clmWork 
-------------------------------- */
table {
	background: #fff;
}

.tblWork th,
.tblWork td,
.tblForm th,
.tblForm td {
	padding: 5px;
}
.tblWork {
	width: 100%;
}
.tblWork th, .tblWork td {
	border: 1px solid #BBB;
}
.tblWork th {
	background-color: #DDD;
}
.tblWork td {
}
.tblWork label {
	margin-right: 20px;
}
.tblWork tr:nth-child(even) {
	background: #F4F0F0;
}
.tblWork tr:hover {
    background-color: #bbb;
    opacity:0.8;
}

.bgA {
	background: #f8f8f8;
}

.hide{
	color: #555;
	background-color: #aaa;
}

/* input upd */
.tblForm {
	width: 100%;
}
.tblForm th {
	border: 1px solid #BBB;
	background-color: rgba(0,0,0,.1);
}
/*
.tblForm tr:nth-child(odd) th {
	background-color: rgba(0,0,0,.1);
}
*/
.tblForm td {
	border: 1px solid #BBB;
}
/*
.tblForm tr:nth-child(odd) td {
	background-color: rgba(0,0,0,.05);
}
*/
.tblForm label {
	margin-right: 20px;
}
.tblForm input {
	margin-right: 3px;
	vertical-align: baseline;
}

.tblForm h3 {
	margin-bottom: 5px;
	padding: 6px 7px 4px;
	background: #CCC;
}


.tblForm input,
.tblForm select,
.tblForm textarea {
	padding: 5px;
}
.tblForm input[type=time] {
	padding: 2.5px;
}

.tblForm input[type=radio]:checked + label {
	font-weight: bold;
}

.imgWrap {
	float: left;
	height: 300px;
	margin-top: 10px;
	margin-right: 10px;
	overflow-y: auto;
	display: inline-block;
}

.input {
	display: inline-block;
}


/* =sidebar
---------------------------------------------------- */
.sidebar {
	float: left;
/*	max-width: 170px;
	width: 13%;*/
	width: 150px;
/*	width: 170px;*/
	padding: 10px 0;
	color: #EEE;
	font-size: 90%;
	background: #756C67;
	box-shadow: 1px 0 0 #000;
	
	
	position: absolute;
	top: 0;
	left: 0;
	height: 100%;	
}

.sidebar h2 {
	margin-bottom: 5px;
	padding: 10px;
}
.sidebar h2 b {
	padding-left: 3px;
	border-left: 3px solid #CCC;
}

.sidebar a {
	color: #EEE;
}

/* =globalNav
------------------------------------------ */
/* ---------- mainNav */
.sidebar .mainNav {
	border-bottom: 3px double #eee;
}
.sidebar .mainNav li {
	display: block;
	border-top: 3px double #eee;
}
.sidebar .mainNav li a {
	display: block;
}
.sidebar .mainNav li a:hover {
	text-decoration: none;
}

.sidebar .mainNav .n1 {
	padding: 10px 5px;
}

/* .sidebar .mainNav li a:hover:after {
	content: "";
	position: absolute;
	right: 0;
	top: 50%;
	margin-top: -8px;
	border: 8px solid transparent;
	border-right: 8px solid #ededed;
} */

.sidebar .mainNav li a:hover {
	background: rgba(255,255,255,0.4);
}



.sidebar .mainNav .active {
	background: rgba(255,255,255,0.8);
}
.sidebar .mainNav .active a {
	color: #000;
}


/* ----- submenu */
.sidebar .submenu {
	/*padding-bottom: 10px;*/
	/* background: rgba(255,255,255,0.05); */
	display: none;
}
.sidebar .active .submenu {
	display: block;
}
.sidebar .submenu li {
/*	border-top: none;*/
	border-top: #888 dotted 1px;
}

.sidebar .submenu li a {
	padding: 3px 8px;
	display: block;
	position: relative;
}
.sidebar .submenu li a:before {
	content: "┗ ";
}

/* =aside
------------------------------------------ */

/* =footer
-------------------------------------------------------------- **/
#footer {
	position: relative;
	color: #EEE;
	padding: 3px 0;
	background: #918985;
	box-shadow: 0 -1px 0 #EDEDED;
}
#footer a {
	color: #EEE;
}

/* =siteFooter
---------------------------------------------------- */

/* =copyright
---------------------------------------------------- */
#copyright {
	text-align: center;
}

/* =pageTop
---------------------------------------------------- */
#pageTop {
	display: block;
	position: fixed;
	bottom: 3px;
}
@media screen and (max-width: 1400px) { /*以下の時*/
#pageTop {right: 0;}
}
@media screen and (min-width: 1401px) { /*以上の時*/
#pageTop {right: 100px;}
}
#pageTop a {
	width: 100px;
	height: 30px;
	font-size: 90%;
	padding: 1px 6px;
	color: #EEE;
	font-weight: bold;
	border-radius: 3px;
	background: #534741;
}
#pageTop a:hover {
	text-decoration: none;
	background: #756C67;
}


/* --------------
 home contents
-------------- */
/* =visual
---------------------------------------------------- */


/* --------------
 subpages contents
-------------- */

/* =login,logout page
---------------------------------------------------- */
#loginCont {
	width: 400px;
	height: 400px;
	margin: auto;
	position: absolute;
	top: 80px;
	right: 0;
	left: 0;
}

#loginCont h1 {
	margin-bottom: 20px;
	text-align: center;
	/*color:#fff;*/
	font-weight:bold;
	font-size:120%;
}
#loginCont h1 img {
	margin-bottom: 15px;
	max-width: 300px !important;
	max-height: 300px !important;
}

#loginCont .mymsg {
	margin-bottom: 15px;
	padding: 10px;
	/*background: #FFF;*/
}

#loginBox {
	padding: 30px 50px 10px;
	/* border: 3px solid #EEE; */
	box-shadow: 0 0 5px #FFF;
	background: #FFF;
	margin-bottom: 80px;
}

#loginBox p {
	margin-top: 20px;
	/*color:#fff;*/
	font-weight:bold;
}
#loginBox input {
	width: 96%;
	padding: 5px 2%;
	border: 1px solid #DDD;
	background: #FFC;
}
#loginBox input[type="submit"] {
	width: inherit;
	border-radius: 3px;
	background: #6c8ab1;
}

#loginBox input:focus {
	box-shadow: 0 0 3px #069;
}


/* =menu page
---------------------------------------------------- */
#menuCont .contents .globalNav ul {
	margin-bottom: 20px;
}

#menuCont .contents .globalNav li {
	margin: 6px 0;
	position: relative;
}

#menuCont .contents .mainNav li:before,
#menuCont .contents .submenu li:before {
	content: "";
	position: absolute;
	left: 0;
	top: 50%;
	margin-top: -4px;
	border: 4px solid transparent;
	border-left: 4px solid #15579E;
}

#menuCont .contents .globalNav li a {
	padding-left: 10px;
}

.contNav {
	margin: 30px 0 30px 50px;
}
.contNav li {
	margin-bottom: 15px;
	padding-left: 10px;
	display: block;
	position: relative;
}

.contNav > li {
	float: left;
	margin-right: 15px;
	padding: 10px;
	border-radius: 10px;
	border: #888 double 3px;
	background: rgba(255,255,255,.2);
  transition: all .3s 0s ease;
}
.contNav > li:hover {
	background: rgba(255,255,255,.8);
	border-color: #00a4ff;
  transition: all .1s 0s ease;
}
.contNav > li:nth-of-type(1) {
	display: none;
}
.contNav > li:nth-of-type(3n+2) {
	/*clear: both;*/
}

.contNav > li li:after {
	content: "";
	position: absolute;
	left: 0;
	top: 10px;
	margin-top: -5px;
	border: 5px solid transparent;
	border-left: 5px solid #534741;
}
.contNav li a {
	color: #000;
	font-weight: bold;
}
.contNav li .submenu {
	margin-top: 5px;
	/*margin-bottom: 15px;*/
	margin-left: .5em;
}
.contNav li .submenu li {
	margin-right: 1.5em;
	margin-bottom: 5px;
	float: left;
}
.contNav li .submenu li:after {
	display: none;
}

.contNav li .submenu a {
	color: #15579E;
	font-weight: normal;
}

/* =shop page
---------------------------------------------------- */
/* ----------calendar */
.ui-datepicker select.ui-datepicker-month, .ui-datepicker select.ui-datepicker-year {width:auto;}


/* =cook page
---------------------------------------------------- */
.floatL {
	width: 41%;
	float: left;
}
.floatL .comtbl {
	margin: 0 0 15px;
}
.floatR {
	width: 59%;
	float: right;
	background: #FFF;
}
.cate_title{
	text-align:left;
	font-weight: bold;
	padding:4px 0 4px 10px;
	border-top:1px solid #F1DFDF;	
	border-left:1px solid #F1DFDF;	
	border-right:1px solid #F1DFDF;	
	background:url(../img/back_pink_dark.gif) repeat-x #FFF8F8;
	color:#F47B7B;
}
.cate_sub1{
	text-align:left;
	margin: 2px;
	margin-left:10px;
}
.cate_sub2{
	text-align:left;
	margin-left:30px;
	margin-bottom:10px;
}
.cate_sub3{
	text-align:left;
	margin-left:50px;
	margin-bottom:10px;
}









.pager {
	margin: 20px 0;
}
.pager a,
.pager b {
	display: inline-block;
	width: 24px;
	height: 24px;
	line-height: 24px;
	margin: 3px;
	background: #ccc;
	box-shadow: 0 -2px 0 rgba(0,0,0,.25) inset;
	text-decoration: none;
	color: #000;
	text-align: center;
	border: #fff solid 1px;
}
.pager a:hover,
.pager b {
	background: #4B5278;
	color: #fff;
}

/*アコーディオン*/
h3.open_h3{
    border-bottom: 1px dotted #a9a9a9;
    cursor: pointer;
    margin: 0;
}
.open_h3:after, 
.open_h3.active:after {
    font-size: 22px;
    margin-left: 20px;
}
.open_h3.active::before {
    content: "▲";
}
.open_h3::before {
    content: "▼";
}

.nb{
	border:none;
}
.bgRed{
	background: #F00 !important;
}

.bgYellow{
	background: #FFFF66 !important;
}
			/*
            .ui-datepicker {
                font-size: 80% !important;
            }
            */
input::placeholder {
  color: #999;
  font-style: italic;
}

 input[type="radio"]:checked + label {
    font-weight:bold;
  }
  input[type="checkbox"]:checked + label {
    font-weight:bold;
  }