﻿@CHARSET "utf-8";
/* Reset CSS
--------------------------------------------------------------------- */
*{
margin:0;
padding:0;
}

html{
font-size:62.5%;
}

body{
background: #fff;
}

a{
text-decoration:none;
}

fieldset,img{
border:0;
}

ol, ul{
list-style:none;
}


/* section0
--------------------------------------------------------------------- */
#section0{
	position:relative;
}


#section0 .floatclear{
	clear: both;
}

#section0 h1{
	position:absolute;
	top:55%;
	left:0;
	right:0;
	z-index:1;
	text-shadow: 0px 0px 8px rgba(0, 0, 0, 0.8);
	line-height:1.5em;
}

#section0 .h1group{
	text-align:center;
	height:0;
}

#section0 .h1group p{
	position:absolute;
	top:30%;
	left:0;
	right:0;
	z-index:99;
}

#section0 nav{
	position:absolute;
	bottom:0;
	left:0;
	width:100%;
	z-index:99;
	text-align:center;
	background: rgba(0,0,0,0);
}

#section0 nav li{
	position:relative;
	border-top:1px solid #fff;
	border-right:1px solid #fff;
	font-size:90%;
	float:left;
	width:15.55%;
	text-align:center;
	padding:10px 0;
	color:#fff;
	text-shadow: 0px 0px 4px rgba(0, 0, 0, 1);
	box-sizing:border-box;
	cursor:pointer;
}

#section0 nav li a{
	display:block;
	color:#fff;
	text-shadow: 0px 0px 4px rgba(0, 0, 0, 1);
}

#section0 nav li:last-child{
	border-right:none;
	width:22.25%;
}

#section0 nav li.n_line{
	border-top:1px solid #004896;
	border-right:1px solid #004896;
	color:#004896;
	text-shadow:none;
}

#section0 nav li:last-child{
	border-right:none;
	}


#section0 nav li.n_line a{
	color:#004896;
	text-shadow:none;
}


/* -- 背景画像切り替えスタイル -- */

.main_p ul{
	display:inline;
	}

#section0 .mainback{
	height:80vh;
	min-height:550px;
	background:url("../img/home/top.jpg");
	background-size:cover;
	position:relative;
}

#section0 .mainback01{
	height:80vh;
	min-height:550px;
	background:url("../img/home/top01.jpg");
	background-size:cover;
	position:relative;
}

#section0 .mainback02{
	height:80vh;
	min-height:550px;
	background:url("../img/home/top02.jpg");
	background-size:cover;
	position:relative;
}

#section0 .mainback03{
	height:80vh;
	min-height:550px;
	background:url("../img/home/top03.jpg");
	background-size:cover;
	position:relative;
}

#section0 .mainback04{
	height:80vh;
	min-height:550px;
	background:url("../img/home/top04.jpg");
	background-size:cover;
	position:relative;
}

#section0 .mainback05{
	height:80vh;
	min-height:550px;
	background:url("../img/home/top05.jpg");
	background-size:cover;
	position:relative;
}

#section0 .mainback06{
	height:80vh;
	min-height:550px;
	background:url("../img/home/top06.jpg");
	background-size:cover;
	position:relative;
}

#section0 .selectnav{
	background-color:#01ADA1;
	color:#fff;
	cursor:pointer;
}
 
#section0 .navfont01{
	border:1px solid #fff;
	color:#fff;
}

/* -- 【ＥＮＤ】背景画像切り替えスタイル -- */

#section0 nav li:hover{
	background-color:#01ADA1;
	color:#fff;
	border-color:#01ada1;
	transition:0.3s;
}

#section0 nav li:hover a{
	color:#fff;
}

#mantionmenulist .text_l{
	text-align:left;
	line-height:1.3em;
	}

.main_p ul li a p{
	text-align:left;
	}

#section0 nav li:hover:before{
	border:10px solid transparent;
	border-bottom-color:#01ADA1;
	border-top-width:0;
	top:-10px;
	content:"";
	display:block;
	left:50%;
	position:absolute;
	width:0;
	pointer-events: none;
	margin-left: -6px;
}

#section0 #kodatemenulist,#section0 #mantionmenulist{
	position:absolute;
	width:95%;
	margin:auto;
	left: 0px; 
	right: 0px; 
	top: 15%; 
	bottom: 38%;
	z-index:999;
}

#section0 #kodatemenulist ul,#section0 #mantionmenulist ul a {
	display:none;
}


#section0 #kodatemenulist li,#section0 #mantionmenulist li{
	width:20%;
	float:left;
	background-color:rgba(255,255,255,0.8);
	height:110%;
	padding:10px;
	box-sizing:border-box;
}

#section0 .kodate_sp li,#section0 #mantionmenulist li{
	width:33.33%;
	float:left;
	background-color:rgba(255,255,255,0.8);
	height:100%;
	padding:10px;
	box-sizing:border-box;}


#section0 #kodatemenulist li a,#section0 #mantionmenulist li a{
	color:#004895;
	display:block;
}

#section0 #kodatemenulist li a:hover ,#section0 #mantionmenulist li a:hover{
	opacity:0.5;
	-webkit-transition: 0.1s ease-in-out;  
       -moz-transition: 0.1s ease-in-out;  
         -o-transition: 0.1s ease-in-out;  
            transition: 0.1s ease-in-out;
}

#section0 #kodatemenulist li:first-child, #section0 #mantionmenulist li:first-child{
	width:100%;
	height:auto;
	font-size:150%;
	line-height:100%;
}

#section0 #kodatemenulist li span, #section0 #mantionmenulist li span{
	font-size:110%;
	font-weight:bold;
	line-height:250%;
}

#section0 #kodatemenulist li span:nth-child(n+2):after {
content: "";
position: absolute;
width: 6px;
height: 6px;
margin: 0.9em 0.2em 0;
border-top: solid 2px #004895;
border-right: solid 2px #004895;
-webkit-transform: rotate(45deg);
        transform: rotate(45deg);
}

#section0 #mantionmenulist li span:nth-child(n+2):after {
content: "";
position: absolute;
width: 6px;
height: 6px;
margin: 0.9em 0.2em 0;
border-top: solid 2px #004895;
border-right: solid 2px #004895;
-webkit-transform: rotate(45deg);
        transform: rotate(45deg);
}


#section0 #kodatemenulist #closekodate, #section0 #mantionmenulist #closemantion{
	float:right;
	cursor:pointer;
	margin:15px 10px 0 0;
}


/* section1
--------------------------------------------------------------------- */
#section1 h2{
	margin:40px 0 40px;
	font:bold 140%/120%;
	text-align:center;
	text-transform:uppercase;
}

#section1 .title{
	padding:70px 0 20px 0;
	font-size:140%;
	font-weight:bold;
	line-height:150%;
	letter-spacing:2px;
	text-transform:uppercase;
}

#section1 h2 span{
	text-transform:lowercase;
}

#section1 section{
	margin:60px auto 0;
	width:55%;
}

#section1 section div{
	width:60%;
	float:left;
	text-align:left;
}

#section1 section div:last-child{
	text-align:center;
	float:right;
	margin-bottom:10px;
	width:300px;
}

#section1 section h3{
	text-align:center;
	margin-bottom:20px;
	letter-spacing:2px;
}

#section1 section div li{
	margin:0 0 1em 0;
	overflow:hidden;
}

#section1 section div li img{
	margin:0 1em 1em 0;
	float:left;
}

#section1 section div li a{
	color:#000;
}

#section1 .fb-page{
	float:none;
	width:100%;
}

/* section2
--------------------------------------------------------------------- */
#section2 ul{
	margin:0 auto;
	width:80%;
	overflow:hidden;
	padding-top:50px;
}

#section2 li{
	position:relative;
	width:20%;
	display:inline-block;
}

#section2 li img{
	width: 200px;
	border-radius: 200px;
	-webkit-border-radius: 200px;
	-moz-border-radius: 200px;
}

#section2 li a{
	font-size:120%;
}

#section2 li p{
	text-align:center;
	padding-bottom:10px;
	font-size:125%;
	letter-spacing:1px;
}

.view:hover{
	opacity:0.5;
	-webkit-transition: 0.1s ease-in-out;  
       -moz-transition: 0.1s ease-in-out;  
         -o-transition: 0.1s ease-in-out;  
            transition: 0.1s ease-in-out;
}

#section2 li .view-tenth-childe span{
	position:absolute;
	text-align:left;
	top:39%;
	left:6%;
}

#section2 li .view-tenth-childe span .inner2{
	font-size:69%;
	white-space:nowrap;
	left:0px;
	top:25px;
}

#section2 .framediv{
	position:relative;
	width:49%;
	float:left;
}

#section2 .morestyle{
	padding-top:10px;
}

.fig{
	text-align:center;
	margin:0 auto;
}

.blog{
	margin-top:-6px;
	display:block;
	float:left;
	}

.btn a{
	display:block;
	margin:0 auto;
	padding:1em 0;
	width:60%;
	text-align:center;
}

.btn a:hover{
	color:#fff;
}

.morestyle{
	color:#004895;
}

.view-tenth{
	position:relative;
	}

.view-tenth span:after {
display: block;
content: "";
position: absolute;
top: 84%;
right: 35%;
width: 6px;
height: 6px;
margin: 30px 0 0 0;
border-top: solid 2px #004895;
border-right: solid 2px #004895;
-webkit-transform: rotate(45deg);
        transform: rotate(45deg);
}


/* section3
--------------------------------------------------------------------- */
#section3 .blockline{
	border:1px solid #004895;
	width:15%;
	margin:30px auto 0;
	padding:12px 0;
	position:relative;
	color:#004895;
}



#section3 .blockline span:after {
content: "";
position: absolute;
width: 6px;
height: 6px;
margin: 8px 1em 0;
border-top: solid 2px #004895;
border-right: solid 2px #004895;
-webkit-transform: rotate(45deg);
        transform: rotate(45deg);
}

.blockline:hover{
	opacity:0.5;
	-webkit-transition: 0.1s ease-in-out;  
       -moz-transition: 0.1s ease-in-out;  
         -o-transition: 0.1s ease-in-out;  
            transition: 0.1s ease-in-out;
}


/* section4
--------------------------------------------------------------------- */
#section4 div{
	display:inline-block;
	text-align:left;
	margin: 3em;
	min-width:50em;
}

#section4 h3{
	margin-top:10px;
	letter-spacing:2px;
	color:#02ACA9;
	text-transform:uppercase;
}

#section4 ul{
	border-top:2px solid #004795;
	margin:10px 0;
	width:58em;
}

#section4 li{
	padding:10px 0;
	border-bottom:1px dashed #b8c6d5;
}


#section4 ul li:nth-child(odd){
	float:left;		
}

#section4 ul li:nth-child(even){
	float:right;	
}

#section4 li {
    text-indent: -1em;
	margin-top:0.7em;
	width:48%;
}

#section4 li img {
	float:left;
	margin-bottom:0.5em;
}

#section4 li :before {
    content: '';
    display: inline-block;
    width: 0;
    height: 0;
    margin-right: 4px;
    margin-left: 4px;
    border: transparent solid 5px;
    border-left-color: #004895;
}

#section4 li a{
	color:#004895;
	margin-left:1.3em;
	float:left;
}

#section4 li a:hover{
	color:#01ada1;
}


/* その他
--------------------------------------------------------------------- */
.baner_top{
	width:100%;
}

.baner_top img{
	width:100%;
}


/*-------------------------------------------
width:1400px以上
-------------------------------------------*/
@media (min-width: 1401px) {
.droppy{
	margin:0 auto;
}

}

/*-------------------------------------------
width:1400px以下
-------------------------------------------*/
@media (max-width: 1400px) {
	
#section0 #kodatemenulist li img, #section0 #mantionmenulist li img{
	max-height:100px;
	width:auto;
}

#section0 #mantionmenulist li p a img{
	max-height:80px;
	width:auto;
}
#section0 #mantionmenulist li a img{
	max-height:100px;
	width:auto;
}


#section0 #kodatemenulist li,#section0 #mantionmenulist li{
	padding:10px 20px;
}

#section0 #kodatemenulist,#section0 #mantionmenulist{
	bottom: 32%;
}

#section0 #kodatemenulist li, #section0 #mantionmenulist li{
	height:100%;
	}

#section2 ul{
	width:100%;
}


#section4 ul{
	width:63%;
	margin:0 auto;
}

#section4 h3{
	width:63%;
	margin:10px auto;
}

#section4 li {
	width:44%;
	}

.dispry_br{
	word-wrap: break-word;
	}
	}
/*-------------------------------------------
width:1030px以下
-------------------------------------------*/

@media (max-width: 1030px) {
#section2 li .view-tenth-childe span{
	text-align:left;
	top:39%;
	left:6%;
}

.section .dispry_br{
	word-wrap: break-word;
}

#section0 nav li{
	width:14.95%;
	}
	
#section0 nav li:last-child{
	width:25.25%;
}


}



/*-------------------------------------------
width:767px以下
-------------------------------------------*/
@media (max-width: 767px) {
	
#kodatemenulist li p{
	display:inherit;
	}	

#section4{
	width:100%;
	}	
	
#section4 ul li:nth-child(even){
	float:left;	
}

#section4 ul li:nth-child(even){
	float:legt;	
}

#section0{
	width:100%;
	}

#section0 .h1group{
	text-align:center;
	height:0;
}

#section0 .h1group p{
	position:absolute;
	top:20%;
	left:0;
	right:0;
	z-index:99;
}

#section0 h1{
	position:absolute;
	top:50%;
	}

#section0 nav{
	position:absolute;
	bottom:0;
	left:0;
	width:100%;
	z-index:99;
	text-align:center;
	background: rgba(0,0,0,0);
}

#section0 nav li{
	position:relative;
	border-top:1px solid #fff;
	border-right:1px solid #fff;
	font-size:90%;
	float:left;
	width:15.55%;
	text-align:center;
	padding:10px 0;
	color:#fff;
	text-shadow: 0px 0px 4px rgba(0, 0, 0, 1);
	box-sizing:border-box;
	cursor:pointer;
	background-color:#004895;
}

#section0 nav li a{
	display:block;
	color:#fff;
	text-shadow: 0px 0px 4px rgba(0, 0, 0, 1);
}

#section0 nav li:last-child{
	border-right:none;
	width:22.25%;
}

#section0 nav li.n_line{
	border-top:1px solid #fff;
	border-right:1px solid #fff;
	color:#fff;
	text-shadow:none;
}

#section0 nav li:last-child{
	border-right:none;
	}


#section0 nav li.n_line a{
	color:#fff;
	text-shadow:none;
}

#section0 #main-menu #menu{
	display:none;
}

/* -- 背景画像切り替えスタイル -- */

.main_p ul{
	display:inline;
	}

#section0 .mainback{
	background:url("../img/home/top_sp.jpg") no-repeat;
	-moz-background-size:contain;
	background-size:contain;
	position:relative;
	height:90vh;
}

#section0 .mainback01{
	background:url("../img/home/top01_sp.jpg");
	-moz-background-size:contain;
	background-size:cover;
	position:relative;
	height:90vh;
}

#section0 .mainback02{
	background:url("../img/home/top02_sp.jpg");
	-moz-background-size:contain;
	background-size:cover;
	position:relative;
	height:90vh;
}

#section0 .mainback03{
	background:url("../img/home/top03_sp.jpg");
	-moz-background-size:contain;
	background-size:cover;
	position:relative;
	height:90vh;
}

#section0 .mainback04{
	background:url("../img/home/top04_sp.jpg");
	-moz-background-size:contain;
	background-size:cover;
	position:relative;
	height:90vh;
}

#section0 .mainback05{
	background:url("../img/home/top05_sp.jpg");
	-moz-background-size:contain;
	background-size:cover;
	position:relative;
	height:90vh;
}

#section0 .mainback06{
	background:url("../img/home/top06_sp.jpg");
	-moz-background-size:contain;
	background-size:cover;
	position:relative;
	height:90vh;
}


}

/* @media screen and (max-width: 640px)
-------------------------------------------------------------------------------*/
@media screen and (max-width: 640px) {
	
#section .h1group{
	width:100%;
}

#logo{
position:absolute;
top:-5px;
left:5px;
z-index:999;
}

#section0 #kodatemenulist li img, #section0 #mantionmenulist li img{
	max-height:65px;
	width:auto;
}

#section0 #kodatemenulist li, #section0 #mantionmenulist li{
	height:40%;
	}

#section0 .mainback{
	height:60vh;
}

#section0 .mainback01{
	height:60vh;
}

#section0 .mainback02{
	height:60vh;
}

#section0 .mainback03{
	height:60vh;
}

#section0 .mainback04{
	height:60vh;
}

#section0 .mainback05{
	height:60vh;
}

#section0 .mainback06{
	height:60vh;
}


h1{
	font-size:19px;
}

.view-tenth span:after {
	margin: 28px 25px 0 0;
	}

#section0 #kodatemenulist,#section0 #mantionmenulist{
	overflow:scroll;
	overflow-x:hidden;
	background-color: rgba(255,255,255,0.8);
}

#section0 #kodatemenulist li,#section0 #mantionmenulist li{
	width:50%;
	background-color:rgba(255,255,255,0.8);
	padding:10px 5px 0 5px;
	box-sizing:border-box;
}

#section0 .kodate_sp li,#section0 #mantionmenulist li{
	width:50%;
	height:40%;
	background-color:rgba(255,255,255,0.8);
	padding:10px 5px 0 5px;
	box-sizing:border-box;
}

#section0 #mantionmenulist .mansion{
	width:100%;
	padding-right:15px;
}

#section0 #mantionmenulist li p{
	float:left;
	margin-left:-15px;
	}


#section0 #mantionmenulist li a img{
	max-width:60%;
	}
	
#section0 #mantionmenulist li a .img_size{
	max-width:35%;
	}
	
#section0 #mantionmenulist li span{
	font-size:100%;
	}

#kodatemenulist li a p ,#mantionmenulist li a p{
	display:none;
	}
	
#mantionmenulist li .text_l{
	display:none;
	}

#section0 nav li{
	float:left;
	width:50%;
	height:50px;
	text-align:center;
	line-height:1.2em;
	padding:15px 0;
	color:#fff;
}

#section0 nav li:last-child{
	border-right:none;
	width:50%;
}

#section2 li{
	padding-top:30px;
	width:100%;
}

#section4 div{
	margin: 3em auto;
	min-width:0;
}

#section4 ul{
	width:90%;
}

#section4 li{
	width:100%;
}

#section4 li a{
	width:65%;
	float:left;
	text-align:justify;
}


#section4 h3{
	width:90%;
}

.dispry_br{
	word-wrap: break-word;
}

.fig baner_top img{
	background:url("../img/home/banner_top_sp.jpg");
	}

}

