@charset "UTF-8";
/* CSS Document */

@font-face {
font-family: 'custom-font';
src: url(../font/AxisStd-UltraLight.eot);
src: url(../font/AxisStd-UltraLight.woff) format('woff');
src: url(../font/AxisStd-UltraLight.woff2) format('woff');
src: url(../font/AxisStd-UltraLight.otf);
}

/* ======================================================================================

    reset

====================================================================================== */

html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, font, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, figure { margin: 0; padding: 0; border: 0; outline: 0; box-sizing: border-box;}
body, table, input, textarea, select, option { font-family:'ヒラギノ角ゴ Pro W3','Hiragino Kaku Gothic Pro','メイリオ','Meiryo',sans-serif; } article, aside, canvas, details, figcaption, figure, footer, header, hgroup, menu, nav, section, summary { display: block; } ol, ul { list-style: none; } blockquote, q { quotes: none; } :focus { outline: 0; } ins { text-decoration: none; } del { text-decoration: line-through; }

html{overflow-y:scroll; }

img{vertical-align:middle; width:100%; height:auto;}

table{border-collapse:collapse; width:100%;}
table td.title{color:#001F92; width: 20%;}
td{padding:5px; border:#CCC solid 1px;}

@media only screen and (max-width:640px) {
	table td.title{width: 30%;}
}

body{position: relative; font-family: "ＭＳ Ｐ明朝", "MS PMincho","ヒラギノ明朝 Pro W3", "Hiragino Mincho Pro", "serif"; font-size:14px;}

a,a:hover img,li,li:hover,a::after,a:hover::after{-webkit-transition: all 0.3s ease;
    -moz-transition: all 0.3s ease;
    -o-transition: all 0.3s ease;
    transition: all  0.3s ease;}

a:link {text-decoration:none; color:#964623;}
a:visited {text-decoration:none; color:#964623;}
a:hover{text-decoration:none; color:#9769ff;}

a:hover img{opacity:0.7; filter: alpha(opacity=70); -ms-filter: "alpha( opacity=70 )";}

p{margin:0 0 10px 0; padding:0;}

h1,h2,h3,h4,h5{font-weight:normal; margin:0; padding:0}

/* ======================================================================================

    common

====================================================================================== */


.flex,.flex_in_flex li{
display:-webkit-box;
display:-moz-box;
display:-webkit-flexbox;
display:-moz-flexbox;
display:-ms-flexbox;
display:-webkit-flex;
display:-moz-flex;
display:flex;
justify-content: space-between;
-webkit-justify-content: space-between;
-moz-justify-content: space-between;
-ms-justify-content: space-between;	
-webkit-flex-wrap:wrap;
-moz-flex-wrap:wrap;
-ms-flex-wrap:wrap;
flex-wrap:wrap;
}

.flex2 li{width:49%;}
.flex3 li{width:32%;}
.flex4 li{width:24%;}
.flex5 li{width:19%;}



.wrapper{margin:0 auto; position:relative; max-width:1150px; padding:0 25px;}

.main_area{padding:50px 0px; background:url(../img/common/bg.jpg) center center no-repeat; background-size:cover;}

h2{font-family: 'custom-font','ヒラギノ角ゴ Pro W3','Hiragino Kaku Gothic Pro','メイリオ','Meiryo',sans-serif;}

h2.topsection,h3{font-size:30px; color:#055D00; position:relative; margin-bottom: 20px; font-family: "ＭＳ Ｐ明朝", "MS PMincho","ヒラギノ明朝 Pro W3", "Hiragino Mincho Pro", "serif"; font-style: italic; border-top: #055D00 solid 2px;}
h2.topsection::after,h3::after{width: 100%; height: 1px; background:#055D00; position: absolute; top: 2px; left: 0px; content: '';}


h2.pagetitle{font-size:55px; color:#fff; font-family: "ＭＳ Ｐ明朝", "MS PMincho","ヒラギノ明朝 Pro W3", "Hiragino Mincho Pro", "serif"; position: absolute; bottom: 5%; left: 5%;}
h2.pagetitle span{font-size:24px; display:block;}

h2.pagetitle{text-shadow: 0 -40px 100px, 0 0 2px, 0 0 1em #000, 0 0 0.5em #000, 0 0 0.1em #000, 0 5px 3px #000;}

h4{font-size: 24px; font-style: italic; border-bottom: #341F00 dotted 1px; margin-bottom: 15px;}




.midashi1{font-family: 'custom-font','ヒラギノ角ゴ Pro W3','Hiragino Kaku Gothic Pro','メイリオ','Meiryo',sans-serif;}
.midashi1{text-align:center; color:#b2aa85; font-size:24px;}

.midashi2{text-align:center; color:#a1714e; font-size:110%;}



.ul01 li{position:relative; padding:.8em .2em .8em 1.3em;}
.ul01 li::before{position: absolute; content: ''; border-radius:100%;
	top: 1.5em;
	left: .3em;
	z-index: 2;
	width: 3px;
	height: 3px;
	background: rgba(255, 150, 50, 1);
}

.ul02 li{position:relative;}
.ul02 li{filter: progid:DXImageTransform.Microsoft.gradient(GradientType=0,startcolorstr=#ffffff, endcolorstr=#f1e9e2));
-ms-filter:"progid:DXImageTransform.Microsoft.gradient(GradientType=0,startcolorstr=#ffffff, endcolorstr=#f1e9e2))";
zoom: 1;
background: -moz-linear-gradient(top center, #ffffff 0%, #f1e9e2 100%);
background: -webkit-gradient(linear, center top, center bottom, from(#ffffff), to(#f1e9e2));
background: linear-gradient(top center, #ffffff 0%, #f1e9e2 100%);
background: linear-gradient(to bottom, #ffffff, #f1e9e2);}

.ul02 li{text-decoration:none; -moz-border-radius:5px; -webkit-border-radius:5px; border-radius:5px; padding:5px 10px; border:#d6c3b9 solid 1px; position:relative; margin-bottom:15px;}

.ul03 li{position:relative; text-align:center; display:block; padding:10px 0; margin-bottom:20px}
.ul03 li::before{position: absolute; content: '▼'; bottom:-30%; left:49%; z-index: 2; color:#FCC; font-size:12px;}
.ul03 li:last-child::before{content: '';}



ul.li_memo li{position:relative; font-size:80%; margin-bottom:5px;}
ul.li_memo li::before{content: '※'; margin-right:5px;}



@media only screen and (max-width:640px) {
	
.midashi1{font-family:'ヒラギノ角ゴ Pro W3','Hiragino Kaku Gothic Pro','メイリオ','Meiryo',sans-serif;}
.midashi1{font-size:16px;}
	
h2.pagetitle{font-size:20px; margin-bottom:20px;}
h2.pagetitle span{font-size:14px;}


h2.topsection,h3{font-size:20px;}


.main_area{padding:30px 0px;}

.flex2 li,.flex3 li,.flex4 li,.flex5 li,.flex_box li{width:100%; margin-bottom: 20px;}

ul.li_memo li{font-size:90%;}

}

/* ======================================================================================

    header/footer

====================================================================================== */

header .wrapper,footer .wrapper{padding-top:20px; padding-bottom:20px; overflow:hidden;}

header{color:#988067; position:relative; z-index:1;}

header h1{max-width:100%; min-width:1000px; background:#f7ffde; display:block; font-weight:normal; font-size:12px; text-align:center; padding:1px 0 1px;}
header h1 span{color:#df7900; margin-left:10px;}

header .titlelogo{width:35%; float:left;}

header{
-moz-box-shadow:0px 0px 18px rgba(0,0,0,0.5);
-webkit-box-shadow:0px 0px 18px rgba(0,0,0,0.5);
box-shadow:0px 0px 18px rgba(0,0,0,0.5);}

header,footer{filter: progid:DXImageTransform.Microsoft.gradient(GradientType=0,startcolorstr=#ffffff, endcolorstr=#f6ffdc));
-ms-filter:"progid:DXImageTransform.Microsoft.gradient(GradientType=0,startcolorstr=#ffffff, endcolorstr=#f6ffdc))";
zoom: 1;
background: -moz-linear-gradient(top center, #ffffff 0%, #f6ffdc 100%);
background: -webkit-gradient(linear, center top, center bottom, from(#ffffff), to(#f6ffdc));
background: linear-gradient(top center, #ffffff 0%, #f6ffdc 100%);
background: linear-gradient(to bottom, #ffffff, #f6ffdc);}


header nav{background:rgba(255,255,255,0.5); font-size:14px;}

header nav ul{overflow:hidden; margin:0 auto; position:relative; max-width:1150px; padding:0 25px;}
header nav a{ display:block; padding:4px 0;}
header nav a:link,header nav a:visited{color:#522900;}
header nav a:hover{color:#b76081;}

header .tel_area{width:30%;float:right; padding: 5px 2%; border: #988067 solid 1px; border-radius:10px;
	-webkit-border-radius:10px;
	-moz-border-radius:10px;}
header .tel_area .novacancy{font-size: 35px;}

footer{position:relative; z-index:1;}

footer nav{ margin-bottom:20px;}

footer .f_nav a:link,header nav a:visited{color:#522900;}
footer .f_nav a:hover{color:#b76081;}

.copy{text-align:center; font-size:90%; clear:both;}


@media only screen and (max-width:760px) {
header nav ul{font-size:12px;}
}

@media only screen and (max-width:640px) {
	
header h1{min-width:0px; display:block; font-weight:normal; font-size:12px; text-align:center; padding:2px 1% 2px;}
header h1 span{margin-left:0px; display:block;}

header .titlelogo{width:80%; float:left;}


header nav,footer nav{display:none}

header .tel_area{width:100%; margin-top: 20px}
header .tel_area .novacancy{font-size:20px;}
}


/* ======================================================================================

    アコーディオン

====================================================================================== */

ul.acordion{margin:0; padding:0;}
ul.acordion .trigger{cursor: pointer;}

ul.acordion li .none-submenu{display: block; padding: 0; width:100%;}
ul.acordion li .active-submenu{display: block; padding: 0; width:100%;}

ul.acordion li{position:relative;}
ul.acordion li .none-submenu::after {content:'▼'; font-size:12px; color:#930; position:absolute; right:0px; top:10px;}
ul.acordion li .active-submenu::after {content:'▲'; font-size:12px; color:#930; position:absolute; right:0px; top:10px;}



/* ======================================================================================

    bt

====================================================================================== */

a.bt01{filter: progid:DXImageTransform.Microsoft.gradient(GradientType=0,startcolorstr=#ffffff, endcolorstr=#e0d4c9));
-ms-filter:"progid:DXImageTransform.Microsoft.gradient(GradientType=0,startcolorstr=#ffffff, endcolorstr=#e0d4c9))";
zoom: 1;
background: -moz-linear-gradient(top center, #ffffff 0%, #e0d4c9 100%);
background: -webkit-gradient(linear, center top, center bottom, from(#ffffff), to(#e0d4c9));
background: linear-gradient(top center, #ffffff 0%, #e0d4c9 100%);
background: linear-gradient(to bottom, #ffffff, #e0d4c9);}

a.bt01{text-decoration:none; -moz-border-radius:5px; -webkit-border-radius:5px; border-radius:5px; padding:5px 40px 5px 10px; border:#c0a08f solid 1px; position:relative;}

a.bt01::after{content:'';
    height: 0;
    position: absolute;
    width: 0;
    border: 5px solid transparent;
    border-left-color: #9a6c53;
    right:5%;
    top: 30%;
	z-index:1;}

a.bt01:hover{}
a.bt01:hover::after{right:1%;}




@media only screen and (max-width:640px) {
a.bt01{display:block;}
}


/* ======================================================================================

    box

====================================================================================== */


.box01,.flex_box li{margin-bottom:20px; -moz-border-radius:10px; -webkit-border-radius:10px; border-radius:10px; padding:15px; overflow:hidden; position:relative; border:#ccbfaa solid 1px;}

.box02{border:#ccbfaa solid 1px; margin-bottom:20px; -moz-border-radius:20px; -webkit-border-radius:20px; border-radius:20px; padding:20px 3%; overflow:hidden; position:relative;}

.box02_no_overflow{border:#ccbfaa solid 1px; margin-bottom:20px; -moz-border-radius:20px; -webkit-border-radius:20px; border-radius:20px; padding:20px 3%; position:relative;}

.box03{margin-bottom:20px; -moz-border-radius:20px; -webkit-border-radius:20px; border-radius:20px; padding:10px 3%; overflow:hidden; position:relative;}
.box03{-moz-box-shadow:0px 0px 10px rgba(0,0,0,0.2);
-webkit-box-shadow:0px 0px 10px rgba(0,0,0,0.2);
box-shadow:0px 0px 10px rgba(0,0,0,0.2);}

/* ======================================================================================

    TOP PAGE

====================================================================================== */



/* ===== mv ==== */
.mvcaption{background:rgba(255,255,255,0); padding:15px; -moz-border-radius:10px; -webkit-border-radius:10px; border-radius:10px; color: #fff; text-shadow: 0 -40px 100px, 0 0 2px, 0 0 1em #9e9800, 0 0 0.5em #9e9800, 0 0 0.1em #9e9800, 0 5px 3px #000; font-size: 30px;}



.appeal p{position: absolute; bottom: 0; left: 0; z-index: 2; width: 100%; background: rgba(0,0,0,.6); color:#FFF;
margin: 0px;
padding:3px 5px;
font-size: 16px;}

.appeal p span{font-size: 80%; display: block;}


.box_topic{padding: 0 10%;}

.panoflex li{width:24%; margin-bottom: 15px; position: relative;}

.panoflex p{position: absolute; bottom: 5px; right: 10px; z-index: 2; color: #fff; text-shadow: 0 -40px 100px, 0 0 2px, 0 0 1em #9e9800, 0 0 0.5em #9e9800, 0 0 0.1em #9e9800, 0 5px 3px #000; font-size: 20px; margin: 0; font-style: italic;}

@media only screen and (min-width:641px) {
.mvcaption{bottom:20px; position:absolute;}
	
}

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

.mv{background:url(../img/top/mv/01.jpg)center center no-repeat; background-size:cover;}


.mvcaption{width:100%; padding:0px;  font-size:12px; position:absolute; text-align: center; top:45%; left: 0;}

.appeal p{ font-size: 12px;}

.panoflex li{width:49%;}
}




#map_canvas{width:100%; height:380px;}

.suv_v{height: 300px;}

@media only screen and (max-width:640px) {
.suv_v{height: 200px;}
}






/* ======================================================================================

    other

====================================================================================== */


@media only screen and (min-width:641px) {
	
.pc{display:block;}
.sp{display:none;}


.res10{width:10%;}
.res11{width:11%;}
.res12{width:12%;}
.res13{width:13%;}
.res14{width:14%;}
.res15{width:15%;}
.res16{width:16%;}
.res17{width:17%;}
.res18{width:18%;}
.res19{width:19%;}
.res20{width:20%;}
.res21{width:21%;}
.res22{width:22%;}
.res23{width:23%;}
.res24{width:24%;}
.res25{width:25%;}
.res26{width:26%;}
.res27{width:27%;}
.res28{width:28%;}
.res29{width:29%;}
.res30{width:30%;}
.res31{width:31%;}
.res32{width:32%;}
.res33{width:33%;}
.res34{width:34%;}
.res35{width:35%;}
.res36{width:36%;}
.res37{width:37%;}
.res38{width:38%;}
.res39{width:39%;}
.res40{width:40%;}
.res41{width:41%;}
.res42{width:42%;}
.res43{width:43%;}
.res44{width:44%;}
.res45{width:45%;}
.res46{width:46%;}
.res47{width:47%;}
.res48{width:48%;}
.res49{width:49%;}
.res50{width:50%;}
.res51{width:51%;}
.res52{width:52%;}
.res53{width:53%;}
.res54{width:54%;}
.res55{width:55%;}
.res56{width:56%;}
.res57{width:57%;}
.res58{width:58%;}
.res59{width:59%;}
.res60{width:60%;}
.res61{width:61%;}
.res62{width:62%;}
.res63{width:63%;}
.res65{width:65%;}
.res66{width:66%;}
.res67{width:67%;}
.res68{width:68%;}
.res69{width:69%;}
.res70{width:70%;}
.res71{width:71%;}
.res72{width:72%;}
.res73{width:73%;}
.res74{width:74%;}
.res75{width:75%;}
.res76{width:76%;}
.res77{width:77%;}
.res78{width:78%;}
.res79{width:79%;}
.res80{width:80%;}
.res81{width:81%;}
.res82{width:82%;}
.res83{width:83%;}
.res84{width:84%;}
.res85{width:85%;}
.res86{width:86%;}
.res87{width:87%;}
.res88{width:88%;}
.res89{width:89%;}
.res90{width:90%;}
}



@media only screen and (max-width:640px) {
	
.pc{display:none;}
.sp{display:block;}

.res10,.res11,.res12,.res13,.res14,.res15,.res16,.res17,.res18,.res19,.res20,.res21,.res22,.res23,.res24,.res25,.res26,.res27,.res28,.res29,.res30,.res31,.res32,.res33,.res34,.res35,.res36,.res37,.res38,.res39,.res40,.res41,.res42,.res43,.res44,.res45,.res46,.res47,.res48,.res49,.res50,.res51,.res52,.res53,.res54,.res55,.res56,.res57,.res58,.res59,.res60,.res61,.res62,.res63,.res64,.res65,.res66,.res67,.res68,.res69,.res70,.res71,.res72,.res73,.res74,.res75,.res76,.res77,.res78,.res79,.res80,.res81,.res82,.res83,.res84,.res85,.res86,.res87,.res88,.res89,.res90{width:100%; margin-bottom:10px;}

.sp_img50{width:50%;}
.sp_img60{width:60%;}
.sp_img70{width:70%;}

}



/*--------共通--------*/

section,article{padding:5px 0;}
section{margin-bottom:50px; overflow:hidden;}
article{margin-bottom:30px; overflow:hidden;}
.grid{margin-bottom:15px; overflow:hidden;}


.photo_l{float:left; margin:0 3% 10px 0;}
.photo_r{float:right; margin:0 0px 10px 10px;}

.box_l{float:left;}
.box_r{float:right;}
.box_c{margin:0 auto;}

.txt_r{text-align:right;}
.txt_l{text-align:left;}
.txt_c{text-align:center;}

.block{display:block;}
.overflow{overflow:hidden;}
.cl{clear:both;}

.img_b5 img{margin-bottom:5px;}
.img_b10 img{margin-bottom:10px;}

.w10{width:10%;}
.w15{width:15%;}
.w20{width:20%;}
.w25{width:25%;}
.w30{width:30%;}
.w35{width:35%;}
.w40{width:40%;}
.w45{width:45%;}
.w50{width:50%;}
.w55{width:55%;}
.w60{width:60%;}
.w65{width:65%;}
.w70{width:70%;}
.w75{width:75%;}
.w80{width:80%;}
.w85{width:85%;}
.w90{width:90%;}
.w100{width:100%;}

.mt5{margin-top:5px !important;}
.mt10{margin-top:10px !important;}
.mt15{margin-top:15px !important;}
.mt20{margin-top:20px !important;}
.mt25{margin-top:25px !important;}
.mt30{margin-top:30px !important;}
.mt35{margin-top:35px !important;}
.mt40{margin-top:40px !important;}
.mt45{margin-top:45px !important;}
.mt50{margin-top:50px !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;}

.mtb5{margin:5px 0 !important;}
.mtb10{margin:10px 0 !important;}
.mtb15{margin:15px 0 !important;}
.mtb20{margin:20px 0 !important;}

.ptb5{padding:5px 0 !important;}
.ptb10{padding:10px 0 !important;}
.ptb15{padding:15px 0 !important;}
.ptb20{padding:20px 0 !important;}

.mr3{margin-right:3px !important;}
.mr4{margin-right:4px !important;}
.mr5{margin-right:5px !important;}
.mr6{margin-right:6px !important;}
.mr7{margin-right:7px !important;}
.mr8{margin-right:8px !important;}
.mr9{margin-right:9px !important;}
.mr10{margin-right:10px !important;}
.mr15{margin-right:15px !important;}
.mr20{margin-right:20px !important;}

.f70per{font-size:70%}
.f80per{font-size:80%}
.f90per{font-size:90%}
.f110per{font-size:110%}
.f120per{font-size:120%}
.f130per{font-size:130%}
.f140per{font-size:140%}
.f150per{font-size:150%}
.f160per{font-size:160%}
.f170per{font-size:170%}
.f180per{font-size:180%}


.f_blue{ color:#6d80bc;}
.f_pink{color:#F69;}

.f_mintyo{font-family:"ＭＳ Ｐ明朝", "MS PMincho", "ヒラギノ明朝 Pro W3", "Hiragino Mincho Pro", serif;}

.memo{font-size:90%;}

.movie-wrap {position: relative; padding-bottom: 50%; padding-top: 30px; height: 0; overflow: hidden;}
.movie-wrap iframe {position: absolute; top: 0; left: 0; width:100%; height:100%;}

#page-top {position: fixed; bottom: 20px; right: 20px; z-index:20;
filter:alpha(opacity=80);
-moz-opacity: 0.8;
opacity: 0.8;
}
#page-top a {text-decoration:none; color: #fff; padding:15px 20px; text-align:center; display: block; border-radius: 5px; background:#bdaa93; font-size:12px;}
#page-top a:hover {text-decoration: none; background:#bd6422;}

.img50 img{width:50%;}
.img60 img{width:60%;}
.img70 img{width:70%;}


/* ======================================================================================

    form

====================================================================================== */

input, button, textarea, select {margin:0; padding:10px; width:100%; background:#fff; border:#0C5B00 solid 1px; border-radius:5px; outline: none; -webkit-appearance: none; -moz-appearance: none; appearance: none; box-sizing: border-box;}

.textarea_h{min-height:200px;}

.bt_submit{color:#FFF; font-size:16px; border-radius:50px; padding:5px 0; background: #0C5B00}
.bt_submit:hover{ background: #4F7C0E}

.bt_submit,.bt_submit:hover{-webkit-transition: all 0.3s ease; -moz-transition: all 0.3s ease; -o-transition: all 0.3s ease; transition: all  0.3s ease;}

.checkbox-wrap{}
.label-checkbox input[type="checkbox"]{display: none;}
.label-checkbox{cursor: pointer;position: relative;}
.label-checkbox .lever{
  display: block;
  color: #979797;
  font-weight: normal;
  display: inline-block;
  padding: 8px 40px;
  border: 1px solid #979797;
  border-radius:20px;
  margin-right: 10px;
  margin-bottom: 10px;
  -webkit-transition: all 300ms cubic-bezier(1, 0, 0, 1);
  -moz-transition: all 300ms cubic-bezier(1, 0, 0, 1);
  -o-transition: all 300ms cubic-bezier(1, 0, 0, 1);
  transition: all 300ms cubic-bezier(1, 0, 0, 1);
  -webkit-transition-timing-function: cubic-bezier(1, 0, 0, 1);
  -moz-transition-timing-function: cubic-bezier(1, 0, 0, 1);
  -o-transition-timing-function: cubic-bezier(1, 0, 0, 1);
  transition-timing-function: cubic-bezier(1, 0, 0, 1);
}
.label-checkbox .lever:before{
  content:'';
  position: absolute;
  left: 10px;
  top:-3px;
  border: 1px solid #979797;
  background: #fff;
  width: 20px;
  height: 20px;
  border-radius:100%;
  -webkit-transition: all 300ms cubic-bezier(1, 0, 0, 1);
  -moz-transition: all 300ms cubic-bezier(1, 0, 0, 1);
  -o-transition: all 300ms cubic-bezier(1, 0, 0, 1);
  transition: all 300ms cubic-bezier(1, 0, 0, 1);
  -webkit-transition-timing-function: cubic-bezier(1, 0, 0, 1);
  -moz-transition-timing-function: cubic-bezier(1, 0, 0, 1);
  -o-transition-timing-function: cubic-bezier(1, 0, 0, 1);
  transition-timing-function: cubic-bezier(1, 0, 0, 1);
}
.label-checkbox:hover .lever:before{border-color: #c51315;}
.label-checkbox input[type="checkbox"]:checked + .lever{background: #c51315;color: #fff;}
.label-checkbox input[type="checkbox"]:checked + .lever{border-color:#c51315;}
.label-checkbox input[type="checkbox"]:checked + .lever:before{left:100%; margin-left: -44px; border-color: #fff;}

.radio-wrap{}
.label-radio input[type="radio"]{display: none;}
.label-radio{cursor: pointer; color: #828c9a; font-weight: normal;
  letter-spacing: 0;
  display: inline-block;
  position: relative;
  margin-right: 20px;
}
.label-radio .lever:before{
  content:'';
  border: 1px solid #ddd;
  width: 20px;
  height: 20px;
  margin-right: 10px;
  display: inline-block;
  vertical-align: middle;
  border-radius:10px;
  -webkit-transition: all 800ms cubic-bezier(1, 0, 0, 1);
  -moz-transition: all 800ms cubic-bezier(1, 0, 0, 1);
  -o-transition: all 800ms cubic-bezier(1, 0, 0, 1);
  transition: all 800ms cubic-bezier(1, 0, 0, 1);
  -webkit-transition-timing-function: cubic-bezier(1, 0, 0, 1);
  -moz-transition-timing-function: cubic-bezier(1, 0, 0, 1);
  -o-transition-timing-function: cubic-bezier(1, 0, 0, 1);
  transition-timing-function: cubic-bezier(1, 0, 0, 1);
}
.label-radio input[type="radio"]:checked + .lever:before{
  opacity: 0;
  background: #eee;
  border-color: #eee;
  transform:scale(2);
}
.label-radio .lever:after{
  content:'';
  opacity: 0;
  position: absolute;
  left: 8px;
  top: 0px;
  width:8px;
  height: 16px;
  border-right: 2px solid #ddd;
  border-bottom: 2px solid #ddd;
  transform:rotate(-200deg);
  -webkit-transition: all 400ms cubic-bezier(1, 0, 0, 1);
  -moz-transition: all 400ms cubic-bezier(1, 0, 0, 1);
  -o-transition: all 400ms cubic-bezier(1, 0, 0, 1);
  transition: all 400ms cubic-bezier(1, 0, 0, 1);
  -webkit-transition-timing-function: cubic-bezier(1, 0, 0, 1);
  -moz-transition-timing-function: cubic-bezier(1, 0, 0, 1);
  -o-transition-timing-function: cubic-bezier(1, 0, 0, 1);
  transition-timing-function: cubic-bezier(1, 0, 0, 1);
}
.label-radio input[type="radio"]:checked + .lever:after{
  opacity: 1;
  position: absolute;
  left: 8px;
  top: 0px;
  width:8px;
  height: 16px;
  border-right: 2px solid #5bc0de;
  border-bottom: 2px solid #5bc0de;
  transform:rotate(40deg);
}



.formtitle{position:relative; color:#a65600; padding:0 0 0 20px;}
.formtitle::after{position: absolute; z-index: 2; content: ''; border: 1px solid #a65600; border-radius: 100%; top:.5em; left:.5em; width:5px; height:5px;}
.formtitle span{background:rgba(200, 80, 0, 1); color:#fff; padding:2px 4px; border-radius:50px; -webkit-border-radius:50px; -moz-border-radius:50px; font-size:80%; margin-left:10px;}



/* ======================================================================================

    パノラマ

====================================================================================== */


/*
    ColorBox Core Style:
    The following CSS is consistent between example themes and should not be altered.
*/
#colorbox, #cboxOverlay, #cboxWrapper{position:absolute; top:0; left:0; z-index:9999; overflow:hidden;}
#cboxOverlay{position:fixed; width:100%; height:100%;}
#cboxMiddleLeft, #cboxBottomLeft{clear:left;}
#cboxContent{position:relative;}
#cboxLoadedContent{overflow:auto;}
#cboxTitle{margin:0;}
#cboxLoadingOverlay, #cboxLoadingGraphic{position:absolute; top:0; left:0; width:100%; height:100%;}
#cboxPrevious, #cboxNext, #cboxClose, #cboxSlideshow{cursor:pointer;}
.cboxPhoto{float:left; margin:auto; border:0; display:block;}
.cboxIframe{width:100%; height:100%; display:block; border:0;}
#colorbox, #cboxContent, #cboxLoadedContent{box-sizing:content-box;}

/* 
    User Style:
    Change the following styles to modify the appearance of ColorBox.  They are
    ordered & tabbed in a way that represents the nesting of the generated HTML.
*/
#cboxOverlay{background:#fff;}
#colorbox{}
    #cboxTopLeft{width:25px; height:25px; background:url(../img/common/colorbox/border1.png) no-repeat 0 0;}
    #cboxTopCenter{height:25px; background:url(../img/common/colorbox/border1.png) repeat-x 0 -50px;}
    #cboxTopRight{width:25px; height:25px; background:url(../img/common/colorbox/border1.png) no-repeat -25px 0;}
    #cboxBottomLeft{width:25px; height:25px; background:url(../img/common/colorbox/border1.png) no-repeat 0 -25px;}
    #cboxBottomCenter{height:25px; background:url(../img/common/colorbox/border1.png) repeat-x 0 -75px;}
    #cboxBottomRight{width:25px; height:25px; background:url(../img/common/colorbox/border1.png) no-repeat -25px -25px;}
    #cboxMiddleLeft{width:25px; background:url(../img/common/colorbox/border2.png) repeat-y 0 0;}
    #cboxMiddleRight{width:25px; background:url(../img/common/colorbox/border2.png) repeat-y -25px 0;}
    #cboxContent{background:#fff; overflow:hidden;}
        .cboxIframe{background:#fff;}
        #cboxError{padding:50px; border:1px solid #ccc;}
        #cboxLoadedContent{margin-bottom:20px;}
        #cboxTitle{position:absolute; bottom:0px; left:0; text-align:center; width:100%; color:#999;}
        #cboxCurrent{position:absolute; bottom:0px; left:100px; color:#999;}
        #cboxSlideshow{position:absolute; bottom:0px; right:42px; color:#444;}
        #cboxPrevious{position:absolute; bottom:0px; left:0; color:#444;}
        #cboxNext{position:absolute; bottom:0px; left:63px; color:#444;}
        #cboxLoadingOverlay{background:#fff url(../img/common/colorbox/loading.gif) no-repeat 5px 5px;}
        #cboxClose{position:absolute; bottom:0; right:0; display:block; color:#444;}

/*
  The following fixes a problem where IE7 and IE8 replace a PNG's alpha transparency with a black fill
  when an alpha filter (opacity change) is set on the element or ancestor element.  This style is not applied to or needed in IE9.
  See: http://jacklmoore.com/notes/ie-transparency-problems/
*/
.cboxIE #cboxTopLeft,
.cboxIE #cboxTopCenter,
.cboxIE #cboxTopRight,
.cboxIE #cboxBottomLeft,
.cboxIE #cboxBottomCenter,
.cboxIE #cboxBottomRight,
.cboxIE #cboxMiddleLeft,
.cboxIE #cboxMiddleRight {
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr=#00FFFFFF,endColorstr=#00FFFFFF);
}

/*
  The following provides PNG transparency support for IE6
  Feel free to remove this and the /ie6/ directory if you have dropped IE6 support.
*/
.cboxIE6 #cboxTopLeft{background:url(../img/common/colorbox/ie6/borderTopLeft.png);}
.cboxIE6 #cboxTopCenter{background:url(../img/common/colorbox/ie6/borderTopCenter.png);}
.cboxIE6 #cboxTopRight{background:url(../img/common/colorbox/ie6/borderTopRight.png);}
.cboxIE6 #cboxBottomLeft{background:url(../img/common/colorbox/ie6/borderBottomLeft.png);}
.cboxIE6 #cboxBottomCenter{background:url(../img/common/colorbox/ie6/borderBottomCenter.png);}
.cboxIE6 #cboxBottomRight{background:url(../img/common/colorbox/ie6/borderBottomRight.png);}
.cboxIE6 #cboxMiddleLeft{background:url(../img/common/colorbox/ie6/borderMiddleLeft.png);}
.cboxIE6 #cboxMiddleRight{background:url(../img/common/colorbox/ie6/borderMiddleRight.png);}

.cboxIE6 #cboxTopLeft,
.cboxIE6 #cboxTopCenter,
.cboxIE6 #cboxTopRight,
.cboxIE6 #cboxBottomLeft,
.cboxIE6 #cboxBottomCenter,
.cboxIE6 #cboxBottomRight,
.cboxIE6 #cboxMiddleLeft,
.cboxIE6 #cboxMiddleRight {
    _behavior: expression(this.src = this.src ? this.src : this.currentStyle.backgroundImage.split('"')[1], this.style.background = "none", this.style.filter = "progid:DXImageTransform.Microsoft.AlphaImageLoader(src=" + this.src + ", sizingMethod='scale')");
}