@charset "UTF-8";
/* Reset
------------------------------------------------------------*/
body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,form,fieldset,input,textarea,p,blockquote,th,td {
	margin: 0;
	padding: 0;
}
address,em,strong,th {
	font-style: normal;
}

table {
	border-collapse: collapse;
	border-spacing: 0;
}

th {
	text-align: left;
}

hr,legend {
	display: none;
}

h1,h2,h3,h4,h5,h6 {
	font-size: 100%;
}

img,fieldset {
	border: 0;
	-webkit-backface-visibility: hidden;
}

li {
	list-style-type: none;
}

img {
	vertical-align: top;
}

/*IE6*/
* html img{
	vertical-align: bottom;
}
/*IE7*/
*:first-child+html img{
	vertical-align: bottom;
}

a{
	outline:none;	
}

/* Fonts
------------------------------------------------------------*/
body {
	font-size: 75%; /* IE */
	font-family: "qMmpS Pro W3","Hiragino Kaku Gothic Pro","CI","Meiryo",verdana,Osaka,"lr oSVbN","MS PGothic",Sans-Serif;
	/*
	font-family: "游明朝体", "Yu Mincho", YuMincho, "Hiragino Kaku Gothic ProN", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, "ＭＳ ゴシック", sans-serif;
	font-family: "游ゴシック", "Yu Gothic", YuGothic, "Hiragino Kaku Gothic ProN", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, "ＭＳ ゴシック", sans-serif;*/

	-webkit-text-size-adjust: 100%;
}
html>/**/body {
	font-size: 12px; /* Except IE */
}

/* clearfix
------------------------------------------------------------*/
.cf:after {  
	visibility: hidden;  
	display: block;  
	font-size: 0;  
	content: " ";  
	clear: both;  
	height: 0;  
}  

* html .cf { zoom: 1; } /* IE6 */  
*:first-child+html .cf { zoom: 1; } /* IE7 */  


.ani_none,
.ani_none > *,
.ani_none:before,
.ani_none:after{
	transition:none !important;
	-webkit-transition:none !important;
	-moz-transition:none !important;	
}


/*------------ 初期設定 ------------*/
p {
	color: #000000;
	line-height: 1.7;	
}

/*------------ 全体 ------------*/
html {
}

body {
}

._hover{
	opacity:1;
	transition: all 0.4s;
}

._hover:hover{
	opacity:0.7;
}

.content-main{
	position:relative;
	background:url(../images/bg.png) repeat left top;
	background-size:36px 36px;
}

.content-main .icon{
	position:absolute;
	right:50%;
	transform:translateX(50%);
	bottom:-35px;
	margin-right:-380px;	
}

.content-youtube{
	padding:50px 0 100px;
}

.youtube,
.youtube2{
	cursor:pointer;	
	position:relative;
}

.youtube:before{
	content:"";
	display:block;
	background:url(../images/icon-movie.png) no-repeat left top;
	background-size:100% auto;
	width:80px;
	height:80px;
	position:absolute;
	left:50%;
	top:50%;
	transform:translate(-50%,-50%);
	opacity:0.6;
}

.content-youtube ul{
	width:760px;
	margin:0 auto;	
}

.content-youtube ul li{
	width:325px;
	float:left;	
	margin-bottom:50px;
}

.content-youtube ul li:nth-child(2n){
	float:right;	
}

.content-youtube ul li a,
.content-youtube ul li div{
	display:block;
	margin-top:15px;	
}

.content-youtube .content-youtube-map{
	width:900px;
	margin:10px auto 0;
	position:relative;
}

.content-youtube .content-youtube-map div{
	display:block;
	position:absolute;	
	
	background:rgba(255,255,255,0);
	_background:none;
	*background:none;
	background:none\9;
}

.content-youtube .content-youtube-map div:hover{
	background:rgba(255,255,255,0.4);
	_background:none;
	*background:none;
	background:none\9;
}

.content-youtube .content-youtube-map div.link01{
	width:60px;
	height:80px;
	left:473px;
	top:215px;	
}

.content-youtube .content-youtube-map div.link02{
	width:60px;
	height:80px;
	left:413px;
	top:230px;	
}

.content-youtube .content-youtube-map div.link03{
	width:60px;
	height:80px;
	left:563px;
	top:215px;	
}

.content-youtube .content-youtube-map div.link04{
	width:60px;
	height:80px;
	left:586px;
	top:130px;	
}

.content-youtube .content-youtube-map div.link05{
	width:60px;
	height:80px;
	left:482px;
	top:390px;	
}

.content-youtube .content-youtube-map div.link06{
	width:60px;
	height:80px;
	left:552px;
	top:390px;	
}



.content-pick{
	width:100%;
	margin-top:120px;
	padding-bottom:80px;
	background:#fce8e7;
}

.content-pick h4{
	text-align:center;
	padding-top:55px;	
}

.content-pick ul{
	width:900px;
	margin:50px auto 0;	
}

.content-pick ul li{
	width:422px;
	float:left;
	margin-bottom:30px;
}

.content-pick ul li:last-child{
	margin-bottom:0px;	
}

.content-pick ul li.sec{
	float:right;	
}

.content-pick ul li a{
	display:block;
	margin-top:15px;	
}

.content-pick ul li p{
	font-size: 117%;
	color:#000;
	line-height: 1.429;
	text-align: left;
	margin-top:10px;
}

.content-pick .btn,
.content-about .btn{
	display:block;
	text-align:center;
	background:url(../images/bg-btn.png) no-repeat left top;
	
	background-size:100% auto;
	width:325px;
	height:	53px;
	margin:30px auto 0;
	color:#005bac;
	font-size:140%;
}

.content-pick .btn:hover,
.content-about .btn:hover{
	text-decoration:none;	
}

.content-pick .btn span,
.content-about .btn span{
	display:block;
	text-align:center;
	padding-top:15px;
}

.content-youtube2{
	position:relative;
	background:url(../images/bg.png) repeat left top;
	background-size:36px 36px;	
	padding:85px 0 85px;
}

.content-youtube2 h3{
	position:absolute;
	left:50%;
	transform:translateX(-50%);
	top:-62px;
	
}

.content-youtube2 .youtube,
.content-youtube2 .youtube2{
	width:325px;
	margin:0 auto;
	text-align:center;	
}

.content-youtube2 .chara{
	position:absolute;
	left:50%;
	transform:translateX(-50%);
	margin-left:-260px;
	bottom:-45px;
}


@media screen and (max-width: 768px) {
	
	
	.content-youtube{
		padding:20% 0 8%;
	}
	
	.content-youtube ul{
		width:86%;
		margin:0 auto;	
	}
	
	.youtube2:before{
		content:"";
		display:block;
		background:url(../images/icon-movie.png) no-repeat left top;
		background-size:100% auto;
		width:20vw;
		height:20vw;
		position:absolute;
		left:50%;
		top:50%;
		transform:translate(-50%,-50%);
		opacity:0.6;
	}
	
	.content-youtube ul li{
		width:100%;
		float:none;	
		margin-bottom:15%;
	}
	
	.content-youtube ul li.sec{
		float:right;	
	}
	
	.content-youtube ul li img{
		width:100%;
		height:auto;	
	}
	
	.content-youtube ul li a,
	.content-youtube ul li div{
		display:block;
		margin-top:5%;	
	}
	
	.content-pick{
		width:100%;
		margin-top:25vw;
		height:auto;
		padding-bottom:10%;
	}
	
	.content-pick h4{
		text-align:center;
		padding-top:12%;
		width:50%;
		margin:0 auto;
	}
	
	.content-pick img{
		width:100%;
		height:auto;
	}
	
	.content-pick ul{
		width:86%;
		margin:8% auto 0;	
	}
	
	.content-pick ul li{
		width:100%;
		float:none;
		margin-bottom:5%;
	}
	
	.content-pick ul li.sec{
		float:none;	
	}
	
	.content-pick ul li a{
		display:block;
		margin-top:5%;	
	}
	
	.content-pick ul li p{
		font-size: 3.4vw;
		line-height: 1.429;
		text-align: left;
		margin-top:5%;
	}
	
	.content-pick .btn,
	.content-about .btn{
		display:block;
		text-align:center;
		background:url(../images/bg-btn-sp.png) no-repeat left top;
		background-size:100% auto;
		width:86%;
		margin:8% auto 0;
		height:15vw;
		margin:8% auto 0;
		color:#005bac;
		font-size:4.5vw;
	}
	
	.content-pick .btn span,
	.content-about .btn span{
		display:block;
		text-align:center;
		padding-top:4%;
	}
	
	.content-youtube2{
		margin-top:10vw;
		position:relative;
		background:url(../images/bg.png) repeat left top;
		background-size:36px 36px;	
		padding:20vw 0 ;
	}
	
	.content-youtube2 h3{
		top:-12vw;
		width:80vw;
	}
	
	.content-youtube2 h3 img{
		width:100%;
		height:auto;	
	}
	
	.content-youtube2 .youtube,
	.content-youtube2 .youtube2{
		text-align:center;
		width:86%;
		margin:0 auto;
	}
	
	.content-youtube2 .youtube img{
		width:100%;
		height:auto;	
	}
	
	.content-youtube2 .chara{
		position:absolute;
		width:30vw;
		left:50%;
		transform:translateX(-50%);
		margin-left:-30vw;
		bottom:-20vw;
	}
	
	.content-youtube2 .chara img{
		width:100%;
		height:auto;	
	}
	
}

/*------------ HEADER ------------*/

/*--clearfix-------------------------------------------------------------------------------------------*/

.header:after,
.header-sns:after,
.intro-table-area:after {
	content: ".";
	display: block;
	height: 0;
	clear: both;
	visibility: hidden;
}

/*--/clearfix-------------------------------------------------------------------------------------------*/


/*--------------------header--------------------*/

.header {
	margin: 20px auto;
	width: 1120px;
}

h1 { float: left;position:relative;	z-index:3;}

h1 img { width: 100px;}

.header .fr{
	float: right;
	margin-right: 20px;
	position:relative;
	z-index:3;
}
.header .fr h2{
	padding-bottom:10px;
}
.header-sns {
	float: right;
	margin-right: 0px;
	position:relative;
	z-index:3;
}

.header-sns li img {
	vertical-align: top;
	width: 26px;
}

body.ie .sp{
	display:none;	
}

.header-sns li {
	float: left;
	overflow: hidden;
	position: relative;
	width: 26px;
}

.header-sns li:hover:after { left: 0;}

.sns-tw { margin: 0 10px 0 10px;}

.footer{
	clear:both;
	margin:0 auto;
	padding:20px 20px;
}
.footer h2{
	float:left;
	position:relative;
	z-index:3;
}
.footer p.copy{
	/*float:right;*/
	text-align:center;
	font-size:12px;
}
.footer .innerCont{
	width:1120px;
	margin:0 auto;
	text-align:center;
}
.footer li{
	display: inline-block;  
    *display: inline;  
    *zoom: 1;
	border-left:1px solid #333;
	line-height:1.2;
	padding:0 10px;
	margin-bottom:20px;
}
.footer li:first-child{
	border:none;
}
.footer li a {
	position: relative;
	display: inline-block;  
    *display: inline;  
    *zoom: 1;
	transition: .3s;
	text-decoration:none !important;
	color:#333 !important;
	font-size:12px;
}
.footer li a::after {
	position: absolute;
	bottom: 0;
	left: 0;
	content: '';
	width: 0;
	height: 1px;
	background-color: #333;
	transition: .3s;
}
.footer li a:hover::after {
	width: 100%;
}

.sp{
	display:none;
}
@media screen and (max-width: 768px) {
	
	.sp{
		display:block;
	}
	
	.pc{
		display:none;	
	}
	
	body ,
	html{
		width:100%;
		min-width:100%;
		overflow-x:hidden;
	}
	
	/*--------------------header--------------------*/
	.header {
		margin: 20px auto;
		width: 100% !important;
		padding:0 5%;
		box-sizing:border-box;
	}
	
	h1 { float: left;}
	
	h1 img { width: 100px;}
	
	.header .fr{
		float: right;
		margin-right: 0;
		position:relative;
		z-index:3;
	}
	.header .fr h2{
		padding-bottom:10px;
		width:180px;
	}
	.header .fr h2 img{ width:100%; height:auto;}
	
	.header-sns {
		float: right;
		margin-right:0;
		margin-top:-5px;
	}
	
	.header-sns li img {
		vertical-align: top;
		width: 30px;
	}
	
	
	.header-sns li {
		float: left;
		overflow: hidden;
		position: relative;
		width: 30px;
	}
	
	.header-sns li:hover:after { left: 0;}
	
	.sns-tw { margin: 0 0px 0 10px;}
	
	.footer{
		width:100%;
		margin:0 auto;
		padding:20px 5% 20px;
		overflow:hidden;
		box-sizing:border-box;
		text-align:center;
		border:none;
	}
	.footer h2{
		float:none;
		margin-bottom:15px;
	}
	.footer p.copy{
		clear:both;
		float:none;
		font-size:12px;
		text-align:center !important;
		padding-top:15px;
	}
	.footer li{ margin-bottom:5px; padding:0 5px 0 5px; line-height:1;}
	.footer li a{ font-size:10px; transition:none !important;}
	.footer li a:hover::after{ width:0 !important;}
	
	.footer ul+a {
		position: relative;
		display: inline-block;
		transition: .3s;
		text-decoration:none !important;
		color:#333 !important;
		font-size:10px;
	}
	
	.btnPageTop{
		position:fixed;
		bottom:0;
		right:0;
		width:30px;
		display:none;
	}
	.btnPageTop img{ width:100%; height:auto;}
	
	.footer #pagetop2{
		clear:none;
		float:right;
		text-align:right;
		margin-top:-10px;
	}
	
	.mt20{ margin-top:10px;}
	.mb20{ margin-bottom:10px;}
	
	.pt20{ padding-top:20px;}
}

/*------------ about ------------*/

.content-about .inner{
	width:1000px;
	margin:30px auto 0;
	position:relative;
}

.content-about .inner p{
	float:left;
	width:585px;
	font-size: 142%;
	color: rgb(34, 24, 21);
	line-height: 1.765;
	text-align: left;
	margin-top:30px;
}

.content-about .inner p span{
	display:block;
	text-align:right;
	margin-top:35px;	
}

.content-about .inner .image{
	float:right;	
}

@media screen and (max-width: 768px) {
	.content-about .inner{
		width:100%;
		margin:8% auto 0;	
		position:relative;
	}
	
	.content-about .inner p{
		width:86%;
		float:none;
		margin:0 auto;
		font-size: 142%;
		color: rgb(34, 24, 21);
		line-height: 1.765;
		text-align: left;
		margin-top:0px;
	}
	
	.content-about .inner p span{
		display:none;
	}
	
	.content-about .inner .image{
		float:none;	
		margin-top:15%;
	}	
	
	#colorbox iframe {
		width: 100%;
		height: 52vw;
	}
}

/*-------- text_right --------*/
.t_right {
	text-align: right;
}

/*-------- text_left --------*/
.t_left {
	text-align: left;
}

/*-------- center --------*/
.t_center {
	text-align: center;
}

/*-------- left --------*/
.left {
	float: left;
}

/*-------- right --------*/
.right {
	float: right;
}

/*-------- ClearBoth --------*/
.cb {
	clear: both;
}

/*-------- COLOR --------*/

.red{
	color:#FF0000;
}

.orange{
	color:#FF6600;
}

.blue{
	color:#0097B2;
}

/*-------- FONT --------*/

.bold{
	font-weight:700;
}

.f10{
	font-size:10px;
}

.f14{
	font-size:14px;
}

/*-------- WIDTH --------*/

.w149{
	width:149px;	
}

.w180{
	width:180px;	
}

.w287{
	width:287px;
}

.w380{
	width:380px;
}

.w304{
	width:304px;
}

/*-------- HEIGHT --------*/

.h350{
	height:350px;	
}

.h375{
	height:375px;	
}

.h500{
	height:420px;	
}

.h600{
	height:470px;	
}

/*-------- MARGIN --------*/

.ml3{
	margin:0 0 0 3px;
}

.ml10{
	margin:0 0 0 10px;
}

.ml30{
	margin:0 0 0 30px;
}

.ml40{
	margin:0 0 0 40px;
}

.ml60{
	margin:0 0 0 60px;
}

.ml70{
	margin:0 0 0 70px;
}

.mb10{
	margin:0 0 10px 0;
}

.mb15{
	margin:0 0 15px 0;
}

.mt3{
	margin:3px 0 0 0;
}

.mt10{
	margin:10px 0 0 0;
}


.mt20{
	margin:20px 0 0 0;
}

.mt30{
	margin:30px 0 0 0;
}

/*-------- PADDING --------*/

.pt5{
	padding-top:5px;
}

.pt10{
	padding-top:10px;
}

.pt15{
	padding-top:15px;
}

.pt20{
	padding-top:20px;
}

.pt25{
	padding-top:25px;
}

.pt30{
	padding-top:30px;
}

.pt40{
	padding-top:40px;
}

.pt60{
	padding-top:60px;
}

.pl10{
	padding-left:10px;	
}

.pl12{
	padding-left:12px;	
}

.pl15{
	padding-left:15px;	
}

.pl20{
	padding-left:20px;	
}

.pl30{
	padding-left:30px;	
}

.pl40{
	padding-left:40px;	
}

.pl50{
	padding-left:50px;	
}

.pl60{
	padding-left:60px;	
}

.pl70{
	padding-left:70px;	
}

.pl80{
	padding-left:80px;	
}

.pl100{
	padding-left:100px;	
}

.pr100{
	padding-right:100px;	
}


.pb20{
	padding-bottom:20px;	
}

/*-------- COMMON --------*/

.pic{
	padding:2px;
	display:block;
	border:1px solid #CCCCCC;
}

.hidden{
	overflow:hidden;
}

.abs{
	position:absolute;
}

.ondes{
	color:#999999;
}