@charset "utf-8";
/*
Copyright(c) 2009, Yahoo! Inc. All rights reserved.
Code licensed under the BSD License:
http://developer.yahoo.net/yui/license.txt
version: 2.8.0r4
*YUI Reset
*@module reset
*@namespace
*@requires*/
html{color:#333;overflow-y:scroll}
body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,code,form,fieldset,legend,input,button,textarea,p,blockquote,th,td,figure{margin:0;padding:0}
table{border-collapse:collapse;border-spacing:0}
fieldset,img{border:0;}
address,caption,cite,code,dfn,em,strong,th,var,optgroup{font-style:inherit;font-weight:inherit}
del,ins{text-decoration:none}
li{list-style:none}
caption,th{text-align:left}
h1,h2,h3,h4,h5,h6{font-size:100%;font-weight:normal}
q:before,q:after{content:''}
abbr,acronym{border:0;font-variant:normal}
sup,sub{ font-size:10px;}
legend{color:#000}
input,button,textarea,select,optgroup,option{font-family:inherit;font-size:inherit;font-style:inherit;font-weight:inherit}
hr{display:none}
address{font-style:normal}
button::-moz-focus-inner{border:0;padding:0}/*For Firefox*/
.EL,.ELM{margin:20px 0;clear:both}/*Element Parts Page Margin用*/
body{
font:15px/1.231 Helvetica,Arial,'Hiragino Kaku Gothic ProN', 'ヒラギノ角ゴ ProN W3', 'モリサワ 新ゴ R','Droid Sans',メイリオ,'sans-serif';
font-family:Helvetica,Arial,'Hiragino Kaku Gothic ProN', 'ヒラギノ角ゴ ProN W3', 'モリサワ 新ゴ R','Droid Sans',メイリオ,'sans-serif';/*for IE Quirks Mode*/}
select,input,button,textarea,button{font:99%}
table{font-size:inherit;font:100%}
pre,code,kbd,samp,tt{font-family:monospace;*font-size:108%;line-height:100%}
.clear{clear:both!important}
.cFix:after{content:".";display:block;clear:both;height:0;visibility:hidden}
.cFix{min-height:1px}
* html .cFix{height:1px}
.mb0{margin-bottom:0!important}
.mb5{margin-bottom:5px!important}
.mb10{margin-bottom:10px!important}
.mb15{margin-bottom:15px!important}
.mb20{margin-bottom:20px!important}
.mb21{margin-bottom:21px!important}
.mb25{margin-bottom:25px!important}
.mb30{margin-bottom:30px!important}
.mb34{margin-bottom:34px!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}
.mb65{margin-bottom:65px!important}
.mb70{margin-bottom:70px!important}
.mb75{margin-bottom:75px!important}
.mb80{margin-bottom:80px!important}
.mb85{margin-bottom:85px!important}
.mb90{margin-bottom:90px!important}
.mb95{margin-bottom:95px!important}
.mb100{margin-bottom:100px!important}
.mr0{margin-right:0!important}
.pb0{padding-bottom:0!important}
.pb11{padding-bottom:11px!important}
.pt10{padding-top:10px!important}
.pt20{padding-top:20px!important}
.lh22{line-height:22px!important}
.no_rwd .phone,.no_rwd .tablet{display:none}
img{display:block;vertical-align:top}
.tx10{font-size:77%!important}
.tx11{font-size:85%!important}
.tx12{font-size:93%!important}
.tx14{font-size:108%!important}
.tx15{font-size:116%!important}
.tx16{font-size:123.1%!important}
.tx17{font-size:131%!important}
.tx18{font-size:138.5%!important}
.tx19{font-size:146.5%!important}
.tx20{font-size:153.9%!important}
.tx21{font-size:161.6%!important}
.tx22{font-size:167%!important}
.tx23{font-size:174%!important}
.tx24{font-size:182%!important}
.tx25{font-size:189%!important}
.tx26{font-size:197%!important}
a:link,a:active{color:#00a0dc;text-decoration:none}
a:hover{color: #0ED1E9;text-decoration: underline}
a:visited{color:#00a0dc;text-decoration:none}
body{background:#fff;line-height:1.7}
body.page_ex{background:#fff}
.disnon{display:none!important}
.w135{width:135px!important}.w225{width:225px!important}.w546{width:546px!important}
.noVisual{position:absolute;top:0px;left:0px;width:1px;height:1px;font-size:1px;overflow:hidden}
.block{padding:0 20px;clear:both}
.blurb{border-style:solid;border-width:2px 0;border-color:#dedede;padding:20px 0;margin-bottom:30px}
.blurb p{font-weight:bold;font-size:153.9%;color:#333}
.paragraph{margin-bottom:30px;clear:both}
.paragraph p{margin-bottom:20px;font-size:93%;color:#333}
.paragraph .day.bold{font-weight:bold}
em{font-weight:bold}
strong{font-weight:bold;}
.red{color:#ff0000}
.error{color:#ff0000;font-weight:bold;font-size:93%}
.error noscript p{color:#000;font-weight:normal;font-size:100%}
.txtR { text-align:right}

@media screen and (max-width:690px){#NoticeTop{padding-bottom:15px}}
@media screen and (max-width:640px){#NoticeTop{padding:15px 6px 10px 6px}}

.printhead {display:none}

dt {
  margin-top: 1em;
  margin-bottom: .2em;
  font-weight: bold;
}

dd {
  padding-left: 1em;
}


.prnlogo,
.prntObj {
	display: none;
}
/*h1,h2 {
	font-weight: bolder;
}*/

/* @group Header --------------------------------- */

#header {
	width: 100%;
	z-index: 20;
	box-sizing: border-box;
	background-repeat:repeat-x;
	position:absolute;
}



#head_inner {
	width:100%;
	height:0;
	padding-top: calc(746 / 2000 * 100%); /* calc(画像高さ ÷ 画像横幅 × 100%) */
	background: url(../img/yokojima.png);
}
#head_inner2 {
	width:100%;
	height:auto;
	background: url(../img/maininagebg.png);
	background-repeat:repeat-x;
	background-position:left bottom;
}

#head_main {
	width:100%;
	margin: 0 auto;
	position:absolute;
	top:0;
	text-align:left
}

#headLogo {
	padding: 10px 50px;
	display:inline-block
}
#headLogo img {
	max-width:200px;
	height:auto
}
#headLogo a {
	display:inline
}
#sns { z-index:99; font-size:36px;position: absolute; top: 10%; right: 5%;}
#sns li { display:inline-block; margin:0 5px}
#sns li a { color:#fff; font-size:25px;
    display: inline-block;
    line-height: 36px;
    width: 120px;
    text-align: center;}
#sns li.icon-fb a {
    background-color: #0a539f;
}
#sns li.icon-tw a {
    background-color: #0798ff;
}
#sns li.icon-rss a {
    background-color: #3bc9ff;
    height: 36px;
    vertical-align: middle;
    background-image: url(../img/hatebu.png);
    background-size: 22%;
    background-repeat: no-repeat;
    background-position: center;
}




#Main {
	width: 1080px;
	margin: 0 auto;
	padding-top:40px;
}

/* @group Footer --------------------------------- */

#footer {
	position: relative;
	margin-top:40px;
}

#footer a {
	-webkit-transition: all 0.2s ease;
	-moz-transition: all 0.2s ease;
	-o-transition: all 0.2s ease;
	transition: all  0.2s ease;
}

#footer a:hover {
	color: #f00000;
	text-decoration: none;
}

/*#footer .pageTop,*/
.footer_menuarea .footer_menuContainer,
#footer_copyright {
	width: 980px;
	margin: 0 auto;
}

#footer_inner {
	width:980px;
	margin:0 auto;
}

#footer .pageTop {
	position: fixed;
	/*top: -70px;*/
	top: auto;
	bottom: 31px;
	right: 0;
	width: auto;
	z-index: 11;
}

#footer .pageTop_area.abBottom {
	position: absolute;
	top: -70px;
	bottom: auto;
	right: 0;
	width: 100px;
}

#footer .pageTop {
	padding: 0 30px;
	text-align: right;
}

#footer .pageTop a {
	display: inline-block;
	opacity: 0;
	-webkit-transition: all 0.5s ease;
	-moz-transition: all 0.5s ease;
	-o-transition: all 0.5s ease;
	transition: all  0.5s ease;
}

#footer .pageTop a.advent {
	opacity: 1;
}

.footer_catLink {
	display: inline-block;
	margin: 0 0 30px;
	font-size: 116%;
	line-height: 1.5;
}



#footer_copyright {
	text-align:center;
	padding-bottom:15px;
}


/* @end */

/* top */
#mainImage  {width: 100%;height: 0;	padding-top: calc(746 / 2000 * 100%); /* calc(画像高さ ÷ 画像横幅 × 100%) */	background: url(../img/mainimage.jpg) center center / cover no-repeat;  }

#mainImage h1 { color:#fff ;font-size:36px; z-index:99; margin:-12% auto 0; position:absolute;text-align: center;width: 100%; background-color:rgba(0, 159, 220, 0.80); line-height:69px}
#mainImage h1 br { display:none}
#mainImage p { color:#efefef ;font-size:20px; z-index:99; margin:-6.5% 0 0 10%; position:absolute; line-height:1.7em}
#mainImage p:nth-child(2) {margin:-6.5% 0 0 42%;}
#mainImage p:nth-child(2):before { content:"×"; position:absolute;font-size: 50px; margin: 20px 0 0 -200px;color:#00a0dc;}
#mainImage p:nth-child(3) {margin:-6.5% 0 0 74%;}
#mainImage p:nth-child(3):before { content:"×"; position:absolute;font-size: 50px; margin: 20px 0 0 -170px;color:#00a0dc;}
#mainImage p span { font-size:32px; padding:0 3px; color:#fff}

@media screen and (max-width: 1600px) {
#mainImage p:nth-child(2):before { margin: 20px 0 0 -130px;}
#mainImage p:nth-child(3):before { margin: 20px 0 0 -140px;}
}
@media screen and (max-width: 1400px) {
#mainImage p:nth-child(2):before { margin: 20px 0 0 -120px;}
#mainImage p:nth-child(3):before { margin: 20px 0 0 -110px;}
}


@media screen and (max-width: 1177px) {
.centerBoxFix { position:inherit !important}
.section2 {    margin-top: 6% !important;}
#Main {padding-top: 2em !important;}
#mainImage p { display:none}

#head_inner2 {
	background-image:none
}

#mainImage h1 { color:#222 ;font-size:20px; z-index:99; margin:10px 0 0 20px; position: inherit; width:auto;background-color: inherit;}
#mainImage p { color:#222 ;font-size:15px; z-index:99; margin:5px 0 0 20px !important; position: inherit; line-height:1.4em;}
#mainImage p br { display:none}
#mainImage p:before { content:"" !important;}
#mainImage p span { font-size:17px; padding:0 3px; color:#222}
#Main { width:100%; padding-top:9em;}
	}

@media screen and (max-width: 869px) {
.section2 {    margin-top: 13% !important;}
#mainImage h1 br { display:block}
#mainImage h1 { line-height:1.4em}
}
@media screen and (max-width: 480px) {
.section2 {    margin-top: 16% !important;}
}


/*content*/
h2 { font-size:20px;}
h3 { font-size:25px; margin:50px 0 10px;}
.caution { font-size:14px; text-align:right; color:#999; margin-bottom:30px;}
#Main table { margin-bottom:30px; font-weight:13px;}
#Main th { vertical-align:top; width:20%; padding:7px 0; border-bottom:1px solid #999}
#Main td { vertical-align:top; width:80%; padding:7px 0; border-bottom:1px solid #999}

.idx { border:1px solid #999; padding-bottom:15px; background-color: #f6f6f6;}
.idx dt { font-size:20px; font-weight:normal; padding:10px 0 0 20px; margin-top:0}
.idx dd { font-size:15px;padding:0 0 3px 25px; list-style-type:decimal;}
.idx a { color:#333}

#Main p { margin-bottom:30px; line-height:1.8em}
#Main p strong { padding-right:10px}
#Main .imgBox { text-align:center; margin-bottom:30px;}
#Main .imgBox img { max-width:820px; margin:0 20px; display:inline-block}

#Main .master { width:100% !important; border:1px solid #999}
#Main .master td { width:33% !important; border-bottom:none; padding:10px 20px 0 10px; line-height:1.6em}
#Main .master td img { max-width:100px; height:auto; float:left; margin-right:10px}
#Main .master td strong { font-weight:normal; font-size:20px;}

.uemura { color:#09ade2}
.ochi { color:#1358a5}
.shino { color:#551596}

.disnon { display:none}
@media screen and (max-width: 1177px) {
h2 { margin-left:20px; margin-right:20px}
h3 { margin:50px 20px 10px;}
#Main p { margin:0 20px 30px}
#Main table { margin-left:20px; margin-right:20px}
.idx { margin-left:20px; margin-right:20px}
#Main .master { width:auto !important; }
#Main .master td { width:32% !important; border-bottom:none; padding:10px 20px 20px 10px}
#Main .master td br { display:none}
#Main .master td strong { display:block}
#Main .master td img { max-width:100px; height:auto; margin-right:10px; margin-bottom:10px}
#Main .imgBox img { max-width:93%; margin:0 20px; display:inline-block}
.footer_menuarea .footer_menuContainer,
#footer_copyright {
	width: 100%;
}

#footer_inner {
	width:100%;
	margin:0 auto;
}
}
@media screen and (max-width: 582px) {
#headLogo {	padding: 10px 10px;}
#Main { padding-top:12em;}

#mainImage p { font-size:12px;}
#mainImage p br { display:none}
#mainImage p span { font-size:14px;}

#Main .imgBox img { max-width:88%; margin:0 20px 0 0; display:inline-block}
#Main .master td { display:table-row}
#Main .master { border:none}
#Main th { vertical-align:top; width:100%; padding:7px 0; border-bottom:none; background-color:#efefef; display:block}
#Main td { vertical-align:top; width:100%; padding:7px 0; border-bottom:1px solid #999; display:block}
#sns {top:3%; right: 3%;}
#sns li a { color:#fff; font-size:25px;
    display: inline-block;
    line-height: 30px;
    width: 30px;
    text-align: center;}
	
}