@charset "utf-8";

/*//////////////////////////////////////////////////////////

	1: Application all
	2: Flame layout
	3: Decoration
	
//////////////////////////////////////////////////////////*/

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

	Application all

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

html,body{
	margin:0;
	padding:0;
}

body{
	text-align:center;
	font-family: 'Segoe UI', 'Helvetica Neue', Helvetica, 'ヒラギノ角ゴ ProN W3', 'Hiragino Kaku Gothic ProN', '游ゴシック体', 'Yu Gothic', 'YuGothic', 'メイリオ', sans-serif;
	line-height:1.5;
	font-size:15px;
	color:#514841;
	width:100%;
	background:#fff;
}

a{
	text-decoration:underline;
	color:#514841;
	transition: all .3s;
}
a:hover{
	text-decoration:none;
	color:#08ae97;
	transition: all .3s;
}

img{
	vertical-align:bottom;
	height: auto;
	border:0;
}

h1,h2,h3,h4,h5,h6{
	font-size:13px;
	margin:0;
}

table{
	text-align:left;
}

form,p,dl,dd,figure{
	padding:0;
	margin:0;
}

input,select,textarea{
	font-size:13px;
}

hr{
	clear:both;
	color:#fff;
	height:1px;
	padding:0;
	margin:0;
	border:0;
	background:transeparent;
}

address,em{
	font-style:normal;
}





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

	Flame layout

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

#layout{
	position:relative;
	text-align:left;
	width:1000px;
	margin:0 auto;
}

#contents{
	float:right;
	width:740px;
}

#side{
	float:left;
	width:230px;
}

#index-contents .news{
	width:750px;
	margin-left: auto;
	margin-right: auto;
}

#footer{
	position:relative;
	clear:both;
	text-align:center;
	width:1000px;
	padding:50px;
	margin:0 auto;
}





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

	Decoration

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

/*== Header ==============================================*/

h1{
	text-align:center;
	width:1000px;
	padding:20px 0 10px;
}

p#address{
	display: flex;
	justify-content: flex-end;
	gap: 30px;
	text-align:right;
	padding-bottom:20px;
}
p#address a img{
	width: auto;
	height: 51px;
}
p#address a:hover img{
	opacity: 0.6;
}
p#address a.youtube-link{
	margin-right: auto;
}


#header{
	display: flex;
	justify-content: space-between;
	align-items: center;
	padding: 20px 0 15px 0;
}
#header h1{
	width: 460px;
	padding: 0;
    margin-right:1em;
}
#header h1 img{
	max-width: 100%;
	height: auto;
}
#header .header-address{
	font-size: 85%;
}
#header .sns-link{
	display: flex;
}
#header .sns-link a:hover{
	opacity: 0.7;
}
/*
#header .sns-link a.youtube img{
	width: 200px;
	margin-right: 10px;
}
#header .sns-link a.instagram img{
	width: 41px;
}
*/


/*== contents =============================================*/

h2.title{
	line-height:1;
	font-size:230%;
	color:#08ae97;
	padding-bottom:30px;
	margin-bottom:30px;
	border-bottom:1px solid #08ae97;
}


.section{
	overflow:hidden;
	width:740px;
	margin-top:70px;
}
h2 + .section{margin-top:30px;}
.section .section{margin-top:30px;}

.section h3{
	line-height:1;
	font-size:130%;
	color:#fff;
	padding:10px;
	margin-bottom:20px;
	border-radius:5px;
	background:#08ae97;
}


.section h4{
	font-size:120%;
	color:#08ae97;
	padding-bottom:20px;
	margin-bottom:20px;
	border-bottom:1px dotted #ccc;
}





/*== side ================================================*/

.banner-movie{
	margin-bottom: 30px;
}
.banner-movie a:hover img{
	opacity: 0.6;
}

ul#navigation,
ul#navigation li ul{
	list-style:none;
	font-size:110%;
	padding:0;
	margin:0;
}

ul#navigation > li{
	position:relative;
	width:230px;
	border-bottom:1px dotted #08ae97;
}
ul#navigation > li:first-child{border-top:1px dotted #08ae97;}
ul#navigation > li:hover{background-color:#08ae97;}
ul#navigation > li:hover > a{color:#fff;}

ul#navigation > li > a{
	display:block;
	text-decoration:none;
	/*text-indent:20px;
	line-height:60px;*/
	width:200px;
	padding:15px;
	background:url('../img/icon_navi.gif') 210px 50% no-repeat;
}

ul#navigation > li.visit{
	color:#fff;
	background-color:#08ae97;
}
ul#navigation > li.visit > a{color:#fff;}



ul#navigation li ul{
	display:none;
	position:absolute;
	z-index:1000;
	top:10px;
	left:200px;
	padding:10px 10px 9px 10px;
	border:1px solid #514841;
	background:#fff;
}
ul#navigation li:hover ul{display:block;}

ul#navigation li ul li a{
	display:block;
	text-decoration:none;
	width:200px;
	padding:10px;
	margin-bottom:1px;
}
ul#navigation li ul li a:hover{
	color:#fff;
	background:#08ae97;
}


iframe#count{
	text-align:center;
	width:230px;
	height:20px;
	margin-top:30px;
}


#index-navigation ul{
	list-style:none;
	font-weight: bold;
	padding:0;
	margin:0;
}
#index-navigation ul.main-nav{
	display: flex;
	justify-content: center;
	font-size: 90%;
	color: #fff;
	background: #08ae97;
    padding-top:5px;
}
#index-navigation ul.main-nav > li{
	position: relative;
}
#index-navigation ul.main-nav > li:not(:last-child)::after{
	content: '｜';
	color: #58cbbb;

}
#index-navigation ul.main-nav > li > a,
#index-navigation ul.main-nav li > span{
	display: inline-block;
	text-decoration: none;
	line-height: 38px;
	color: #fff;
}

#index-navigation ul.main-nav li ul.sub-nav{
	transition: .3s;
	visibility: hidden;
	opacity: 0;
	position: absolute;
	z-index: 1000;
	top: 30px;
	left: -20px;
	white-space: nowrap;
	text-align: left;
	padding: 20px;
	box-shadow: 0 0 3px rgba(0,0,0,0.3);
	background: #fff;
}
#index-navigation ul.main-nav li a.toggle:hover ~ ul.sub-nav,
#index-navigation ul.main-nav li ul.sub-nav:hover{
	visibility: visible;
	opacity: 1;
	top: 40px;
}
#index-navigation ul.main-nav li ul.sub-nav li::before{
	content: '»';
	color: #aaa;
	margin-right: 5px;
}
#index-navigation ul.main-nav li ul.sub-nav li:not(:last-child){
	margin-bottom: 15px;
}
#index-navigation ul.main-nav li ul.sub-nav li a{
	display: inline-block;
	white-space: nowrap;
	font-weight: normal;
}





/*== footer ===============================================*/

#footer ul{
	overflow:hidden;
	list-style:none;
	text-align:left;
	font-size: 90%;
	/*line-height:98px;
	height:98px;*/
	padding:60px 0 60px 93px;
	margin:0;
	border:1px solid #ccc;
	border-width:1px 0;
	background:url('../img/footer-logo.jpg') 0 50% no-repeat;
}

#footer ul li{
	display:inline-block;
	float:left;
	padding-left:10px;
	margin-right:15px;
}
#footer ul li:before{
	content:"»";
}

#footer ul li.clear{
	clear:left;
}

#copyright{
	padding-top:20px;
}