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

/*==============
  BASE STYLE
  ==============*/

.cf:before,.cf:after {content: " "; display: table; }
.cf:after { clear: both; }
.cf { *zoom: 1; }

body{
	font-family:Avenir , "Open Sans" , "Helvetica Neue" , Helvetica , Arial , Verdana , Roboto , "游ゴシック" , "Yu Gothic" , "游ゴシック体" , "YuGothic" , "ヒラギノ角ゴ Pro W3" , "Hiragino Kaku Gothic Pro" , "Meiryo UI" , "メイリオ" , Meiryo , "ＭＳ Ｐゴシック" , "MS PGothic" , sans-serif;
	font-size:13px;
	line-height:2;
	color:#000;
	/*background-color:#CBD9F1;*/ background-color:#FFFFFF;
}
img{
	max-width:100%;
	height:auto;
	vertical-align:bottom;
}

a{ color:#555; text-decoration:underline;  }
a:hover{ color:#000; }

.pc{ display:block; }
.sp{ display:none; }
.sp720{ display:none; }
@media screen and (max-width:720px){
.sp720{ display:block; }
}
@media screen and (max-width:640px){
body{
	font-size:16px;
	line-height:1.7;
}
}
@media screen and (max-width:480px){
.pc{ display:none; }
.sp{ display:block; }
}

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

*, *:before, *:after {
    -webkit-box-sizing: border-box;
       -moz-box-sizing: border-box;
         -o-box-sizing: border-box;
        -ms-box-sizing: border-box;
            box-sizing: border-box;
}

.fontsize-s{ font-size:12px; }

/* ----- pagetop ----- */

.pagetop {
	position: fixed;
	bottom: 15px;
	right: 15px;
	width: 50px;
	height: 50px;
}
.pagetop a {
	display: block;
	width: 50px;
	height: 50px;
	border-radius: 50%;
	background: #9fb7d4;
	color: #fff;
	font-size: 22px;
	line-height: 2.2;
	text-align:center;
	text-decoration:none;
}
.pagetop a:hover {
	display: block;
	width: 50px;
	height: 50px;
	border-radius: 50%;
	background: #4776AF;
	text-decoration:none;
}


/*==============
  ALL STYLE
  ==============*/
.headertag{ position:relative;/* margin-bottom:20px;*/ }
.headertag2{ position:relative; }
.headerwrap{ position:relative; background-color:rgba(0,0,0,0.67)   }
.header{ position:relative; z-index:2; width:100%;; max-width:1200px; margin:0 auto; }
.header h1{ padding:10px; color:#fff; font-size:12px; line-height:16px; text-align:right; }
.header-logo{ width:75%; padding:0 5px 5px 5px; max-width:500px; text-align:center; margin:0 auto;  }
@media screen and (max-width:480px){
.header h1{ padding:5px; font-size:11px; }
.header-logo{ max-width:80%; }
}

.topimagewrapover{ padding-bottom:20px; background-color:#121318; }



.topimagewrap{
	z-index:0;
	position:absolute;
	width:100%;
	max-width:1600px;
	background: #121318;
	background-image:url(../images/topimage2.jpg);
	background-position:center top;
	background-size:cover;
	background-repeat:no-repeat;
	height:550px;
	/*padding-top:550px;*/
	margin-left:auto;
	margin-right:auto;
}

.headertag{ position:relative; height:550px; }



@media screen and (min-width:1601px){
.topimagewrap{
	max-width:none;
	background-size:contain;
	height:550px;
}
.headertag{ position:relative; height:550px; }
}
@media screen and (max-width:800px){
.topimagewrap{
	max-width:none;
	background-size:cover;
	height:500px;
}
.headertag{ position:relative; height:500px; }
}
@media screen and (max-width:640px){
.topimagewrap{
	height:480px;
}
.headertag{ position:relative; height:480px; }
}
@media screen and (max-width:480px){
.topimagewrap{
	height:420px;
}
.headertag{ position:relative; height:420px; }
}
@media screen and (max-width:360px){
.topimagewrap{
	height:320px;
}
.headertag{ position:relative; height:320px; }
}





.topimagewrap2{
	z-index:0;
	position:absolute;
	width:100%;
	/*max-width:1600px;*/
	background: #121318;
	background-image:url(../images/topimage2.jpg);
	background-position:center -50px;
	background-size:auto;
	background-repeat:no-repeat;
	height:240px;
	/*padding-top:550px;*/
	margin-left:auto;
	margin-right:auto;
}
.headertag2{ position:relative; height:240px; }


@media screen and (min-width:1600px){
.topimagewrap2{
	max-width:none;
}
}
@media screen and (max-width:800px){
.topimagewrap2{
/*	max-width:none;
	background-size:auto;
	height:240px;*/
}
.headertag2{ position:relative; height:240px; }
}	
@media screen and (max-width:640px){
.topimagewrap2{
	height:200px;	background-position:center -80px;
}
.headertag2{ position:relative; height:200px; }
}
@media screen and (max-width:480px){
.topimagewrap2{
/*	height:200px;*/

}
.headertag2{ position:relative; height:200px; }
}
@media screen and (max-width:360px){
.topimagewrap2{
/*	height:200px;*/
}
.headertag2{ position:relative; height:200px; }
}


.topimagetext{ position:absolute; bottom:-80px; width:100%; text-align:center; z-index:2; }
@media screen and (max-width:1400px){ .topimagetext{ bottom:-60px; text-align:right; } }
@media screen and (max-width:1000px){ .topimagetext{ } }
@media screen and (max-width:800px){ .topimagetext{ } }
@media screen and (max-width:640px){ .topimagetext{ bottom:-30px; } }
@media screen and (max-width:480px){ .topimagetext{ bottom:-40px; } }
@media screen and (max-width:360px){ .topimagetext{ } }



.nav2wrap{ /*background: url(../images/back2.jpg) fixed center bottom no-repeat; background-size:cover;*/ padding-bottom:10px; background:#edf9f0;  }


.infowrap{
	position:relative;
	width:100%;
	max-width:1220px;
	margin:0px auto;
	padding-top:30px;
}
.infobox{
  width: 80%;
  max-width: 1200px;
  background-color: #fff;
  margin: 15px auto;
  padding: 10px;
}
@media screen and (max-width:720px){
  .infobox{
  width: 94%;
}
}
.infobox li{
  list-style: disc;
  border-top: 1px dotted #aaa;
  padding-top: 5px;
  margin-bottom: 5px;
  margin-left: 20px;
  color: #F00;
  font-size: 13px;
  line-height: 1.2;
}
.infobox li:first-child{border-top: none;}
.infobox li a{
  color: #000;
}


.nav2box{
	position:relative;
	width:100%;
	max-width:1220px;
	margin:0px auto;
	padding:30px 0 30px 0;
}
.nav2{
	position:relative;
	width:100%;
	max-width:1220px;
	margin:0px auto;

}
.nav2 > div{
	width:20%;
	padding:0 10px;
	float:left;
}
.nav2 > div > div{
	width:100%;
	padding-bottom:0px;
	padding-top:0px;
}
.nav2 > div > div p{ line-height:10px; }

.nav2 .catbtntext	{  border-top:3px solid #000; padding:5px; background-color:#fff; font-size:13px; line-height:1.5; text-align:left; }

.nav2 a:hover img{ opacity:0.8; }

.nav2 a:hover{  color:#000; }

@media screen and (max-width:880px){
.nav2{ width:96%; }
.nav2 > div{
	padding:0 5px;
}
}

@media screen and (max-width:720px){
.nav2 img{ width:100%; }
.nav2{
}
.nav2 > div{
	width:33.3333%;
	padding:0px 2px;
	float:left;
	margin-bottom:10px;
}
.nav2 > div > div{
	width:100%;
	padding:0px 0px 0px 0px;
	margin:0px;
}
/*.nav2 .catbtntext{ max-height:157px; overflow:hidden; }*/
}

@media screen and (max-width:420px){
/*.nav2 > div{ width:50%; }
.nav2 .catbtntext{ max-height:122px; overflow:hidden; }*/
}



.nav2 label {
  display: block;
}

.nav2 label:hover {
}

input[type="checkbox"].on-off{
  display: none;
}

.nav2 div div p {
  -webkit-transition: all 0.5s;
  -moz-transition: all 0.5s;
  -ms-transition: all 0.5s;
  -o-transition: all 0.5s;
  transition: all 0.5s;
  margin: 0!important;
  padding: 0!important;
  list-style: none;
}

input[type="checkbox"].on-off + .nav2 div div p{
  height: 0!important;
  overflow: hidden;
}

input[type="checkbox"].on-off:checked + .nav2 div div p{
  height: 100px!important;
}

@media screen and (max-width:640px){
  input[type="checkbox"].on-off:checked + .nav2 div div p{
    height: 200px!important;
  }

}





.title1{ /*font-family:"Roboto Slab" , Garamond , "Times New Roman" , "游明朝" , "Yu Mincho" , "游明朝体" , "YuMincho" , "ヒラギノ明朝 Pro W3" , "Hiragino Mincho Pro" , "HiraMinProN-W3" , "HGS明朝E" , "ＭＳ Ｐ明朝" , "MS PMincho" , serif;*/ font-size:36px; margin-left:10px; display:inline-block; border-bottom:2px solid #000; border-top:2px solid #000; 
 }
.title2{ /*font-family:"Roboto Slab" , Garamond , "Times New Roman" , "游明朝" , "Yu Mincho" , "游明朝体" , "YuMincho" , "ヒラギノ明朝 Pro W3" , "Hiragino Mincho Pro" , "HiraMinProN-W3" , "HGS明朝E" , "ＭＳ Ｐ明朝" , "MS PMincho" , serif;*/ font-size:32px; margin-bottom:20px; color:#fff; display:inline-block; border-bottom:2px solid #fff; border-top:2px solid #fff; }
@media screen and (max-width:640px){.title1{ font-size:36px; }}
@media screen and (max-width:480px){.title1{ font-size:30px; }}
@media screen and (max-width:350px){.title1{ font-size:24px; }}

.copyright{ font-size:10px; font-family:Arial, Helvetica, sans-serif; color:#fff; text-align:center; margin-top:40px; margin-bottom:20px; }


.nav1 div{ text-align:center; }
.nav1 div span a{ display:inline-block; padding:8px 20px; background-color:rgba(164,30,55,1.00);/* border-radius:5px;*/ margin:2px; text-decoration:none; color:#fff; }
.nav1 div span a:hover{ background-color:rgba(232,26,65,1.00); }
@media screen and (max-width:720px){
.nav1 div span{ display:block; width:80%; margin:5px auto; }
.nav1 div span a{ display:block; width:100%; }
}

/*==============
  EACH STYLE
  ==============*/
  
/* ---- HOME ----- */


.back1{
	background: url(../images/back5.jpg) fixed center bottom no-repeat; background-size:cover;
	padding:20px 0;
}

.reclistwrap{ width:100%;/* background: url(../images/back3.jpg) fixed center bottom no-repeat; background-size:cover;*/
	/*padding:20px 0;*/ }

.reclist{
	width:96%;
	max-width:1200px;
	margin:20px auto 0 auto;
}


@media screen and (max-width:640px){
.reclist{
	margin:20px auto 20px auto;
}
}
.reclistone{
	width:100%;
	margin-bottom:20px;
	/*background-color:#fff;*/
}

.reclisttitle{ background:url(../images/dia3.svg); }
.separateline{ background:url(../images/dia3.svg); height:10px; }

section.reclistone > div h1 { color:#fff; font-size:28px; line-height:28px; float:left; width:50%; padding:10px 10px; margin:0; font-family:"Roboto Slab" , Garamond , "Times New Roman" , "游明朝" , "Yu Mincho" , "游明朝体" , "YuMincho" , "ヒラギノ明朝 Pro W3" , "Hiragino Mincho Pro" , "HiraMinProN-W3" , "HGS明朝E" , "ＭＳ Ｐ明朝" , "MS PMincho" , serif; }
section.reclistone > div h1 a{ color:#fff; text-decoration:none; }
section.reclistone > div.catkiso h1			{ background-color:#000; }
section.reclistone > div.catkutai h1		{ background-color:#000; }
section.reclistone > div.catsiage h1		{ background-color:#000; }
section.reclistone > div.catsetubi h1 	{ background-color:#000; }
section.reclistone > div.catsonota h1 	{ background-color:#000; }
section.reclistone > div h2 { /*background-color: #fff;*/   font-size:20px; line-height:24px; float:right; width:50%; padding:20px 10px; margin:0; }
section.reclistone > div h2 span { display:inline-block; padding-left:10px; font-size:16px; }

.reclistbox{ background-color:#f7f6dc; }
.reclistboxleft{ width:47%; float:left; background-color:#f7f6dc; }
.reclistboxright,
.reclistboxright2{ width:50%; float:right; }

.reclistboxleft img{ float:left; display:inline; margin:0 15px 0 0; max-width:250px; width:50%; }
.reclistboxleft .text{ margin-top:10px; font-family:"Roboto Slab" , Garamond , "Times New Roman" , "游明朝" , "Yu Mincho" , "游明朝体" , "YuMincho" , "ヒラギノ明朝 Pro W3" , "Hiragino Mincho Pro" , "HiraMinProN-W3" , "HGS明朝E" , "ＭＳ Ｐ明朝" , "MS PMincho" , serif; font-size:13px; padding-left:10px; }
.reclistboxright table,
.reclistboxright2 table,
.reclistboxleft table{ width:100%; }
.reclistboxright th,
.reclistboxright2 th,
.reclistboxleft th{
	/*border-bottom:1px solid #000;*/
	white-space:nowrap;
	vertical-align:top;
	text-align:left;
	padding:10px 5px 10px 34px;
	color:#000;
}
.reclistboxright th.markkinmuchi,
.reclistboxright2 th.markkinmuchi{ background:#fff url(../images/recmark1.png) 5px 9px no-repeat; }
.reclistboxright th.markjikan,
.reclistboxright2 th.markjikan{ background:#fff url(../images/recmark2.png) 5px 9px no-repeat; }
.reclistboxright th.markokane,
.reclistboxright2 th.markokane{ background:#fff url(../images/recmark3.png) 5px 9px no-repeat; }
.reclistboxright th.markpr,
.reclistboxright2 th.markpr{ background:#fff url(../images/recmark4.png) 5px 9px no-repeat; }
.reclistboxright td,
.reclistboxright2 td,
.reclistboxleft td {
	/*border-bottom:1px solid #000;*/
	vertical-align:top;
	text-align:left;
	padding:10px;
	 background-color: #E8F4FB;
}
.recdetailbtn{ /*padding:2px 2px 0 0; */}
.recdetailbtn a{
	display:block;
	background-color: rgba(164,30,55,1.00);
	text-align:center;
	text-decoration:none;
}
.recdetailbtnleft{ float:left; width:45%; }
.recdetailbtnright{ float:right; width:55%; }
.recdetailbtn a.btn1{ width:100%; padding:15px 10px;　background-color: rgba(164,30,55,1.00); color:#fff; font-size:18px; line-height:18px; }
.recdetailbtn a.btn2{ width:35%; padding:10px 5px; float:left; background-color:#002E58; color:#fff; }
.recdetailbtn a.btn3{ width:65%; padding:10px 5px; float:right; background-color:#234500; color:#fff; }
.recdetailbtn a.btn2 img,.recdetailbtn a.btn3 img{ height:28px;}
.recdetailbtn a.btn2 span,.recdetailbtn a.btn3 span{ display:inline-block; height:28px; font-size:14px; line-height:14px; overflow:hidden; padding-left:5px; text-align:left; vertical-align:bottom; }

.recdetailbtn a.btn22{ width:50%; padding:10px 5px; float:left; background-color:#002E58; color:#fff; }
.recdetailbtn a.btn32{ width:50%; padding:10px 5px; float:right; background-color:#234500; color:#fff; }
.recdetailbtn a.btn22 img,.recdetailbtn a.btn32 img{ height:28px;}
.recdetailbtn a.btn22 span,.recdetailbtn a.btn32 span{ display:inline-block; height:28px; font-size:14px; line-height:14px; overflow:hidden; padding-left:5px; text-align:left; vertical-align:bottom; }

.recdetailbtn input.btn2{ width:35%; padding:10px 5px; float:left; background-color:#002E58; color:#fff; }
.recdetailbtn input.btn2{ height:48px;}
.recdetailbtn input.btn22{ width:50%; padding:10px 5px; float:left; background-color:#002E58; color:#fff; }
.recdetailbtn input.btn22{ height:48px;}
.recdetailbtn input.btn22 span{ display:inline-block; height:28px; font-size:14px; line-height:14px; overflow:hidden; padding-left:5px; text-align:left; vertical-align:bottom; }



@media screen and (max-width:640px){
/*.reclistone{
	border-radius:10px;
	padding:15px 10px;
	margin-bottom:30px;
}*/
section.reclistone > div h1 { color:#fff; font-size:20px; line-height:30px; float:none; width:100%; padding:10px 10px; margin:0; }
section.reclistone > div h2 {/* background-color: #fff; font-size:16px; line-height:20px; float:none; width:100%; padding:5px 10px; margin:0;*/ float:none; font-size:10px; line-height:10px; padding:3px 10px; }
section.reclistone > div h2 span { display:inline-block; padding-left:10px; font-size:14px; }

.reclistboxleft{ width:100%; float:none; text-align:center;  /*margin-bottom:20px;*/ }
.reclistboxleft p{ text-align:left; }
.reclistboxright,
.reclistboxright2{ width:100%; float:none; }
.reclistboxleft img{ margin:0 5px 5px 0; width:45%; }
.pctable{ display:none; }

}


table.saiyodata { /*border-left:1px solid #888; border-top:1px solid #888;*/ width:100%; }
.saiyodata th{
/*	border-right:1px solid #888;
	border-bottom:1px solid #888;*/
	vertical-align:top;
	text-align:left;
	padding:10px;
	background-color:#fff;
	width:20%;
}
.saiyodata td{
/*	border-right:1px solid #888;
	border-bottom:1px solid #888;*/
	vertical-align:top;
	text-align:left;
	padding:10px;
	 background-color: #E8F4FB;
}
.saiyodata tr:hover th{ background-color:#CBF0CD; }
.saiyodata tr:hover td{ background-color:#CBF0CD; }

.saiyodata th.tablesubttl{ background-color:rgba(0,64,132,1.00); color:#fff; text-align:center; font-weight:bold; }
.saiyodata tr:hover th.tablesubttl{ background-color:rgba(0,64,132,1.00); }

.recoubobtn{}


@media screen and (max-width:640px){
.saiyodata th{
	width:30%;
}
}
.recdetailphoto{ padding-top:0px; background-color:#000;  }
.recdetailphoto p{ float:left; margin:0px; padding:0; width:16.666666%; }
@media screen and (max-width:640px){
.recdetailphoto p{ float:left; margin:0px; padding:0; width:33.3333333%; }
}


.pagenate{
	position:relative;
	overflow:hidden;
}
.pagenate ul{
	position:relative;
	left:50%;
	float:left;
}
.pagenate li{
	position:relative;
	left:-50%;
	float:left;
	list-style:none;
}
.pagenate li a{
	display:block;
	padding:3px 5px;
/*	border:1px solid #fff;*/
	margin:2px;
	background-color:rgba(164,30,55,1.00);
	text-decoration:none;
	color:#fff;
}
.pagenate li a:hover{
	background-color: rgba(232,26,65,1.00); color:#fff;
}
.pagenate li span{
	display:block;
	padding:3px 5px;
/*	border:1px solid #FFF;*/
	margin:2px;
	color:#000;
	background-color:#fff;
}

.cattitletext{
	margin-bottom:30px;
	color:#fff;
}

/* ----- Each Page ----- */

.footer{ background-color:#000; padding:30px 0; }
.bottomlogo{ max-width:500px; width:50%; margin:0 auto 20px auto; }
@media screen and (max-width:640px){
.bottomlogo{ max-width:500px; width:80%; margin:0 auto 20px auto; }
}



#formWrap{ background-color: rgba(255,255,255,0.76); padding:10px 10px 0 10px; }
.formcomment{ background-color:#000; color:#fff; padding:5px 10px; }
#formWrap input,
#formWrap button,
#formWrap textarea,
#formWrap select {
	-webkit-appearance: none;
	-moz-appearance: none;
	appearance: none;
	border:0px solid #ccc;
}
#formWrap input,
#formWrap select,
#formWrap textarea{ width:100%; padding:10px; border:none;	background-color:#fff;  } 
#formWrap input.submit{ width:60%; padding:10px; background-color:rgba(164,30,55,1.00); color:#fff; border:none; font-size:24px; font-family:"Roboto Slab" , Garamond , "Times New Roman" , "游明朝" , "Yu Mincho" , "游明朝体", "ＭＳ Ｐ明朝", "MS PMincho", "ヒラギノ明朝 Pro W3", "Hiragino Mincho Pro", serif; }
#formWrap input.submit:hover{ background-color:#4776AF; }
#formWrap input.hidden{ padding:0; margin:0; }
#formWrap span{ font-size:11px; color:888; line-height:1.1em; color:#F00; }
#formWrap table{
	width:100%;
	border-top:0px solid #888;
	border-left:0px solid #888;
}
/*#formWrap th{
	width:25%;
	background-color:rgba(213,239,247,1.00);
	border-bottom:0px solid #888;
	border-right:0px solid #888;
	padding:5px 10px;
	vertical-align:middle;
}*/
#formWrap th{
	width:25%;
	border-bottom:0px solid #888;
	border-right:0px solid #888;
	padding:5px 10px;
	vertical-align:middle;
}
/*#formWrap th p{background-color:rgba(213,239,247,1.00); padding:5px;}*/
#formWrap td{
	border-bottom:0px solid #888;
	border-right:0px solid #888;
	padding:5px 10px;
}

.formthanks,.formthanks a{ color:#fff; }

@media screen and (max-width:640px){
#formWrap,
.contact-tel{ margin-left:0px; }
#formWrap input.submit{ width:60%; }
#formWrap input.submit:hover{ background-color:#4776AF; }
#formWrap span{ font-size:11px; color:888; line-height:1.1em; color:#F00; }
#formWrap table,
#formWrap tbody,
#formWrap tr,
#formWrap th,
#formWrap td{ display:block; width:100%; max-width:none; }
#formWrap td{ padding:10px 10px 10px 10px; }
#formWrap td.submittd{ text-align:center; }
}


.textsubttlblack{ width:80%; margin-left:auto; margin-right:auto; background-color:#000; color:#fff; padding:5px 10px; }
.backwhitetrans76{ width:80%; margin-left:auto; margin-right:auto; background-color: rgba(255,255,255,0.76); padding:20px; margin-bottom:50px; }
@media screen and (max-width:640px){
.textsubttlblack{ width:100%; margin-left:auto; margin-right:auto; background-color:#000; color:#fff; padding:5px 10px; }
.backwhitetrans76{ width:100%; margin-left:auto; margin-right:auto; background-color: rgba(255,255,255,0.76); padding:20px; margin-bottom:50px; }
}
.textsubttl{ font-weight:bold; margin-bottom:10px; }

.ulon > li{ margin-bottom:20px; list-style:square; margin-left:20px; }
.olon > li{ margin-bottom:20px; list-style:decimal; margin-left:20px; }
.ulon2 > li{ margin-bottom:0px; list-style:square; margin-left:20px; }

input{ border-radius:0; }