@charset "utf-8";
/* 
html5doctor.com Reset Stylesheet v1.6.1
Last Updated: 2010-09-17
Author: Richard Clark - http://richclarkdesign.com 
*/
html {-webkit-text-size-adjust: 100%;/* 2 */-ms-text-size-adjust: 100%;}
body { width:100%; overflow-x:hidden;}
* { font-family:"arial","ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;}
html, body, div, span, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
abbr, address, cite, code,
del, dfn, em, img, ins, kbd, q, samp,
small, strong, sub, sup, var,
b, i, dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, figcaption, figure, 
footer, header, hgroup, menu, nav, section, summary,
time, mark, audio, video { margin:0; padding:0;	border:0;	outline:0;	list-style:none;	vertical-align:baseline;	background:transparent; outline:none; line-height: 1.4em; letter-spacing: 0.1em;}
body { line-height:1;}
img {border-style: none;} 
article,aside,details,figcaption,figure,
footer,header,hgroup,menu,nav,section { display:block;}
nav ul, ul, li { list-style:none;}
blockquote, q { quotes:none;}
blockquote:before, blockquote:after,
q:before, q:after {content:'';content:none;}
mark {background-color:#ff9;color:#000; font-style:italic;font-weight:bold;}
del {text-decoration: line-through;}
abbr[title], dfn[title] {border-bottom:1px dotted;cursor:help;}
table {border-collapse:collapse;border-spacing:0;}

/*inputなど*/

input[type="text"],
textarea { width: 80%; vertical-align:middle; outline: none; border: 1px solid #999; -webkit-transition: all .3s; transition: all .3s;}
.mast{ background: #fff2f2;}
input[type="text"]:focus,
.mast:focus,
textarea:focus { box-shadow:0 0 0 2px #e54737; border: 1px solid #e54737; background: #fff; }
 select {
	padding:0 10px;
    line-height: 30px;
    color: #555;
	-webkit-appearance: none;
	-moz-appearance: none;
	appearance: none;
	border: 1px solid #999;
    cursor: pointer;
}
@media screen and (max-width: 600px){
input, textarea, select{ font-size: 18px;}
}

@media screen and (max-width: 320px){html, body { min-width:320px;}}
/*===================
 LINK
=====================*/
a, a img {-webkit-transition:0.4s; -moz-transition:0.4s; -o-transition:0.4s; transition:0.4s;}
a, a:visited, a:hover, a:active { text-decoration:none; outline: none; text-decoration: underline;}
a:hover, a:hover img { opacity:1; filter: alpha(opacity=100);}
@media screen and (max-width: 660px) {body, html { width:100%; overflow-x:hidden;}}
@media screen and (max-width: 480px) {body { background: #fff;}}
/*============================
selection
==============================*/

/*===================
 FONT
=====================*/
h1,h2,h3,h4,h5,h6 {line-height:1.6em; font-size:18px; font-weight: bold; color:#333;	letter-spacing:1px;}
p,li,dt,dl,span { font-size:16px; letter-spacing:1px; line-height:1.6em; color:#444;}
@media screen and (max-width: 640px) {
p,li,dt,dl,span { font-size:15px;}
}
@media screen and (max-width: 400px) {
h1,h2,h3,h4,h5,h6 {line-height:1.5em; font-size:16px;}
p,li,dt,dl,span { line-height:1.5em; font-size:14px;}
}
/*===================
	CONTENTS
=====================*/
.contMin{ width:100%; width:800px\9; *width:800px; margin:0 auto; overflow:hidden\9; *overflow:hidden; position:relative; z-index:1;}
header, footer, .cont, .inner, article { width:100%; float:left; position: relative; z-index: 1;}

@media screen and (min-width: 801px) {.contMin {max-width:800px;}}
@media screen and (max-width: 834px) {.inner { width: 96%; padding: auto 2%;}}
@media screen and (max-width: 800px) {.contMin { float: left;}}

.contMin > img, 
.contMin > a img{ width: 100%; height: auto; max-width: 800px; vertical-align:bottom;}
/*============================
  clearfix
==============================*/
.cf:before, .cf:after { content: " "; display: table;}
.cf:after { clear: both;}
.cf { *zoom: 1;}
/*============================
  切り替え
==============================*/
.pc{display: block;}
.sp{display: none;}
@media screen and (max-width: 640px) {
.pc{ display: none;}
.sp{ display: block;}
}
.noPC{ display: none;}
@media screen and (max-width: 600px) { .noPC{ display: block;}}
/*============================
  共通クラス
==============================*/
.f12{ font-size: 12px;}
.mb10 { margin-bottom: 10px;}
.mb15 { margin-bottom: 15px;}
.mb20 { margin-bottom: 20px;}
.mt10 { margin-top: 10px;}
.mt15 { margin-top: 15px;}
.mt20 { margin-top: 20px;}
.mP10{ padding-top: 10px;}
.mP20{ padding-top: 20px;}
.mP30{ padding-top: 30px;}
.block{ display: block;}
/*============================
  header
==============================*/
header{ position: fixed; z-index: 1000000000;}
.kasouhead{ width: 100%; float: left; position: relative;}
.kasouhead h1{ height: 40px; width: auto; padding: 10px 0 0;}
.kasouhead h1 img{ height: 100%; width: auto;}
.kasouhead p{ font-size: 12px; color: #007344; font-weight: bold; padding:3px 0 5px; display: block;}
/*MENU*/
header dl{ position: fixed; top: 10px; right: 50%; margin-right: -390px; z-index: 100000000000;}
header dl dt{ width:100px; height: 44px; float:left; cursor: pointer; z-index: 1000; position: relative;}
header dl dt span{display: block;}
header dl dt span.off{ display: block;}
header dl dt span.on{ display: none;}
header dl dt.down span.off{ display: none;}
header dl dt.down span.on{ display: block;}
header dl dd{ width: 400px; display: none; background: #fff; padding:0 10px; position: absolute; top: 100%; right: 0; box-shadow: 1px 2px 3px #555; z-index: 2;}
header dl dd a{ display: block; text-decoration: none; color: #111; line-height: 50px; border-bottom: dotted 1px #ccc; font-weight: bold; letter-spacing: 0;}
header dl dd a::before{content: "・";}
header dl dd a.blank::before{content: ">";}
header dl dd a.town{ color: #06743f;}

/**/
@media screen and (max-width: 834px) {
header dl{ right: 1%; margin-right: 0;}
.kasouhead h1{ height:30px;}   
.kasouhead h1 img{ margin-left: 10px;}
.kasouhead p{ margin-left: 10px;}
}
@media screen and (max-width: 600px) {

header dl{ position: fixed; float: none; top:8px; right:auto; left: 100%; margin-right:0; margin-left:-110px; z-index: 99999999999;}
header dl dt{ background: #888;}
header dl dt.down{ width: 100%; position: fixed; float: none; left: 0; top: 0; background: #222; z-index: 999999999999;}
header dl dd{ z-index: 100; width:94%; position: fixed; padding:50px 3% 0px; top:0; background: #fff;}
header dl dd a{}
.kasouhead p{ font-size: 9px;}
}

/*============================
  footer
==============================*/
footer{ background: #eee; padding: 10px 0;}
footer .cf{}
footer .cf *{ font-size: 12px; display: inline-block; line-height: 20px;}
footer .cf ul{ display: inline-block; float: left;}
footer .cf ul li{ padding-right: 15px;}
footer .cf ul li a{}
footer .cf ul li a:hover{ text-decoration: none;}
footer .cf p{ float: right; letter-spacing: 0;}

@media screen and (max-width: 600px) {
footer .cf *{ font-size: 11px;}
footer .cf ul li{ padding-right: 10px;}
}
@media screen and (max-width: 540px) {
footer .cf ul{ width: 100%; text-align: center;}
footer .cf ul li{ padding: 0 5px; display:inline;}
footer .cf p{ width: 100%; text-align: center; padding: 5px 0 15px;}
}
@media screen and (max-width: 400px) {
footer .cf ul li{ display: block; margin: 4px 0;}
}

/*============================
  pageup
==============================*/
.pageup{ position: fixed; right: 10px; bottom: 10px; z-index: 10000000000000000000000;}
.pageup a{width: 50px; line-height: 50px; text-align: center; background: #333; color: #fff; display: block; text-decoration: none; opacity:0.7; 
border-radius: 4px;
-webkit-border-radius: 4px;
-moz-border-radius: 4px;
}
.pageup a:hover{ opacity:1;
border-radius: 30px;
-webkit-border-radius: 30px;
-moz-border-radius: 30px;
}


/*▼ ここから▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼*/
img.mt{ margin-top: 40px;}
#top{ text-align: center; color: #fff; background: #012b7f; line-height: 36px; font-weight: bold;}
@media screen and (max-width:851px) {
#top{ text-align: left; text-indent: 1em;}
}
@media screen and (max-width:440px) {
#top{ font-size: 12px;}
}
@media screen and (max-width:360px) {
#top{ font-size: 10px;}
}
/*---------------------
 List
---------------------*/
#body .mktoText.cont ul li, 
#body .mktoText.cont ul li img{ width: 100%; max-width: 800px; height: auto; display: block;}

/*---------------------
 ImageArea
---------------------*/
#imageArea{}
#imageArea .cont{ margin: 0; padding: 0;}
#imageArea .cont a{ display: block;}
#imageArea .cont img{ width: 100%; max-width: 800px; height: auto;}
#imageArea > .mktoText > div img{width: 100%; max-width: 800px; height: auto;}

#imageArea > span{ width: 90%; margin-left: 4%; padding: 0 2%; display: block;  font-size:15px; position: relative;}
#imageArea > span::before{ content: "・"; position: absolute; left: 0; top: 0;}
#imageArea > span.end{ margin-bottom: 50px;}

@media screen and (max-width: 640px) {
#imageArea > span{ width: 94%; margin-left: 0; font-size:12px; padding: 0 2% 0 4%;}
}

/*---------------------
 ImageArea
---------------------*/

/*------*/
#infoDl{ margin:30px 0 60px; overflow: hidden;}
#infoDl dt, 
#infoDl dd {width: 100%; float: left;}
#infoDl dt *{ font-size: 20px;}
#infoDl dd, 
#infoDl dd *{font-size: 18px;}
#infoDl dd b.mT{ margin-top: 20px;}
#infoDl dd span, 
#infoDl dd b, 
#infoDl .preTxt div p{ width: 90%; padding-left: 1em;}
#infoDl dd.tyuu span::before, 
#infoDl dd.pre b::before{content: "・"; margin-left: -1em;}



#infoDl dt div p{ width: 96%; float: left; padding:0 2%; font-weight: bold; margin: 4px 0;}
#infoDl dd div p{ width: 100%; float: left; margin:10px 0 35px;}

#infoDl .preTxt div p::before{ content: "・"; position: absolute; left: 0; top: 2px;}

#infoDl .preTxt div > *{ width: 100%; float: left; display: block;}

@media screen and (max-width:851px) {
#infoDl{ width: 94%; margin: 0 3% 50px;}
}
@media screen and (max-width:600px) {
#infoDl dt *, 
#infoDl dd, 
#infoDl dd *{font-size: 16px;}
#infoDl dd b{ margin: 10px 0 5px;}

#infoDl .preTxt div{ padding: 2px 0 2px 5%; width: 95%;}
}
@media screen and (max-width:500px) {
#infoDl dt *, 
#infoDl dd, 
#infoDl dd *{font-size: 14px;}
}
@media screen and (max-width:400px) {
#infoDl dt *, 
#infoDl dd, 
#infoDl dd *{font-size: 13px;}
}


/*---------------------
 注意事項
---------------------*/
.tyui_zikou{}
.tyui_zikou span{ display: block; margin: 0 0 10px 1em; position: relative;}
.tyui_zikou span:before{ position: absolute; content: "・"; left: -1em; top: 0;}



/*--------------------*/
#v_form{ padding: 40px 0; background: #fff; border-top: solid 2px #9b0020;}
#v_form .cf h3{ text-align: center; margin-bottom: 20px;}
#v_form .cf h3 span {
    display: inline-block;
    font-size: 20px;
    background: #9b0020;
    padding: 5px 30px;
    color: #fff;
    text-indent: 10px;
    border-radius: 10px;
    -webkit-border-radius: 10px;
    -moz-border-radius: 10px;
}


/*--------------------*/
/*footer*/
#footerLinks{ padding-top: 40px;}
#footerLinks *{ font-size: 12px;}
#footerLinks > *{ display: inline-block;}
#footerLinks ul{ float:left;}
#footerLinks ul li{ padding-right: 15px; display: inline-block;}
#footerLinks .copy{ float: right; color: #666;}

@media screen and (max-width: 896px) {
#infoArea{ width: 96%; margin: 0 2%;}
#pageTitle{ font-size: 15px;}
}
@media screen and (max-width:800px) {
#footerLinks ul, 
#footerLinks .copy{ width: 96%; margin: auto 2% 5px;  text-align: center;}
}
@media screen and (max-width: 600px) {
#pageTitle{ margin-bottom: 0;}
#footerLinks ul li{ width: 100%; margin: 5px 0;}
}




input[type="checkbox"]+label{ margin-top: -4px!important; padding-bottom: 14px; font-size: 16px;}


/*---------------------
 2020.08.04 追加
　リストナカグロあり
---------------------*/
ul.ten_style{ width: 100%; float: left; margin: 10px 0 35px;}
ul.ten_style li{ margin:5px 0 5px 30px; list-style:disc;}
ul.ten_style li *{ width: auto !important; padding: 0 !important;}