html,body {background: #FFF; color: #000; margin:0;}

body {
	font-family:"游明朝", YuMincho, "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "HG明朝E", "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif !important;
	color:#000;
	margin:0;
	padding:0;
	font-size:100%;
}
h1,h2,h3,h4,h5{
	font-family:"游明朝", YuMincho, "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "HG明朝E", "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif !important;
	font-weight:normal !important;
	line-height: 1.7em !important;
	color:#000;
}

.clearfix:after{
	content: ".";
	display: block;
	height: 1px;
	clear: both;
	visibility: hidden;
}
.clearfix{
	display:inline-block;/* MAC IE用　*/
	min-height:1%;/* IE 7用 */
}
/*--MAC IEは非適用→ \*/
* html .clearfix{height: 1%;}
.clearfix{display: block;}
/*--ここまでMAC IEは非適用 */

a:hover img{
	opacity:0.8;
	filter: alpha(opacity=80);
	-ms-filter: "alpha( opacity=80 )";
	background: #fff;
}

.nohover:hover img{
	opacity:1.0 !important;
	filter: alpha(opacity=100) !important;
	-ms-filter: "alpha( opacity=100 )" !important;
	background: #fff !important;
}

.fl{
	float:left;
}
.fr{
	float:right;
}

.mb5{ margin-bottom:5px;}
.mb10{ margin-bottom:10px;}
.mb15{ margin-bottom:15px;}
.mb20{ margin-bottom:20px;}
.mb30{ margin-bottom:30px;}
.mb40{ margin-bottom:40px;}

.mr5{ margin-right:5px;}
.mr10{ margin-right:10px;}
.mr15{ margin-right:15px;}
.mr20{ margin-right:20px;}
.mr30{ margin-right:30px;}
.mr40{ margin-right:40px;}

.ml5{ margin-left:5px;}
.ml10{ margin-left:10px;}
.ml15{ margin-left:15px;}
.ml20{ margin-left:20px;}
.ml30{ margin-left:30px;}
.ml40{ margin-left:40px;}

address{
	text-align: center;
	font-size: 80%;
	padding-bottom: 20px;
}

/* 画面サイズが1050px以上の場合に適用 */
@media screen and (min-width: 1050px) {
	.contents{
		width: 1050px;
		margin: 0 auto;
		position: relative;
		padding: 50px 0;
	}
}
/* 画面サイズが1050px以下の場合に適用 */
@media only screen and (max-width: 1049px) {
	.contents{
		width: 100%;
		position: relative;
	}
}
/* 画面サイズが630px以上の場合に適用 */
@media screen and (min-width: 630px) {
	.contents2{
		width: 630px;
		margin: 0 auto;
		position: relative;
		padding: 50px 0;
	}
}
/* 画面サイズが630px以下の場合に適用 */
@media only screen and (max-width: 630px) {
	.contents2{
		width: 100%;
		position: relative;
		padding: 50px 0;
	}
}

@media only screen and (min-width: 630px) {
.spbr{
	display: none;
}
}

/* ========== Main img ========== */
.main_img img,.main_img2 img{
	width: 100%;
}

@media screen and (min-width: 1200px) {
	.main_img{
		width: 1200px;
		margin: 0 auto;
	}
}
/* 画面サイズが1050px以下の場合に適用 */
@media screen and (max-width: 1200px) and (min-width: 630px){
	.main_img{
		width: 100%;
		margin: 0 auto;
	}
}
@media only screen and (min-width: 631px) {
	.main_img2{
		display: none;
	}
}
@media only screen and (max-width: 630px) {
	.main_img{
		display: none;
	}
	.main_img2{
		width: 100%;
		margin: 0 auto;
	}
}


/* ========== Profile ========== */
.cnt01{
	width: 100%;
	padding: 40px 0;
	background: url("images/cnt01.png") no-repeat;
	background-size: 100%;
}

.box01{
	width: 470px;
	float: left;
	margin-right: 40px;
}
.box01 img{
	width: 100%;
}
.box02{
		width: 470px;
		float: left;
		padding: 30px 0 0 20px;
}
/* 画面サイズが1050px以下630px以上の場合に適用 */
@media only screen and (max-width: 1050px) and (min-width: 630px) {
	.box01{
		width: 50%;
	}
	.box02{
		width: 37%;
		padding: 0;
	}
}

/* 画面サイズが630px以下の場合に適用 */
@media only screen and (max-width: 630px) {
	.box01{
		width: 80%;
		margin: 0 0 10px;
	}
	.box02{
		width: 90%;
		padding: 0 0 0 7%;
	}
	.yt{
		width: 125px;
	}
}


/* ========== Youtube ========== */

/* 画面サイズが1050px以上の場合に適用 */
@media screen and (min-width: 930px) {
	.cnt02{
		width: 930px;
		margin: 120px auto;
		position: relative;
	}
	.box03{
		width: 49%;
		margin-bottom: 20px;
	}
	.yt{
		position: absolute;
		top: -110px;
		right: 220px;
	}
}
/* 画面サイズが1050px以下の場合に適用 */
@media only screen and (max-width: 930px) {
	.cnt02{
		width: 90%;
		padding: 0 5% 20%;
		position: relative;
	}
	.box03{
		width: 100%;
	}
	.video{
		width:100%;
		padding-bottom: 56.25%;
		height:0px;
		position: relative;
		margin-bottom: 30px;
	}
	.video iframe{
		position: absolute;
		top: 0;
		left: 0;
		width: 100%;
		height: 100%;
	}
}
/* 画面サイズが630px以上の場合に適用 */
@media screen and (min-width: 630px) {
	.contents2{
		width: 630px;
		margin: 0 auto;
		position: relative;
		padding: 50px 0;
	}
	.box07{
		width: 49%;
		float: left;
	}
	.box08{
		width: 49%;
		float: right;
	}
}
/* 画面サイズが630px以下の場合に適用 */
@media only screen and (max-width: 630px) {
	.contents2{
		width: 100%;
		position: relative;
		padding: 30px 0;
	}
	.box07,.box08{
		width: 90%;
		margin: 0 auto;
		padding: 0 5% 1%;
	}
}
.youtube_btn{
	text-align: center;
	display: block;
	clear: both;
}
.box07 img,.box08 img{
	width: 100%;
}


/* ========== History ========== */
.cnt03{
	background: #d8eaf5;
	margin-bottom: 90px;
}
.history{
	position: absolute;
	top: -85px;
}
.history_cnt h2{
	text-align: center;
}
.history_cnt dt{
	width: 10%;
	float: left;
	margin-right: 4%;
}
.history_cnt dd{
	width: 86%;
	float: left;
	margin: 0;
}
/* 画面サイズが630px以下の場合に適用 */
@media only screen and (max-width: 630px) {
.history_cnt dl{
	padding: 0 5%;
}
.history_cnt dt{
	width: 15%;
	margin-right: 5%;
}
.history_cnt dd{
	width: 80%;
}
.history{
	width: 150px;
	top: -55px;
}
}

/* ========== Policy ========== */
.cnt04{
	background: #f3f3d2;
}
.policy_cnt h2{
	text-align: center;
}
.policy_cnt dl dt{
	font-size: 115%;
	margin:0 0 10px 0;
}
.policy_cnt dl dd{
	font-size: 95%;
	margin: 0 0 30px 0;
}
.policy{
	position: absolute;
	left: 50%;
	margin-left: -273px;
	top: -72px;
}
@media screen and (min-width: 1050px) {
	.policy_cnt{
		width: 1050px;
		margin: 0 auto;
		position: relative;
		padding: 50px 0;
	}
}
/* 画面サイズが1050px以下の場合に適用 */
@media only screen and (max-width: 1049px) {
	.policy_cnt{
		width: 94%;
		padding: 3%;
		position: relative;
	}
}
@media screen and (min-width: 770px) {
.policy01{
    width: 35%;
    float: left;
    margin: 0 5% 0 0;
}
.box04{
	width: 60%;
	float: left;
	padding: 4% 0;
}
.policy02{
    width: 35%;
    float: right;
    margin: 0 0 5% 0;
}
.box05{
	width: 30%;
	float: right;
	padding: 60px 20px;
}
.policy03{
	clear: both;
    width: 25%;
    float: left;
    margin: 0 5% 0 0;
}
.box06{
	width: 60%;
	float: left;
}
}

/* 画面サイズが770px以下の場合に適用 */
@media screen and (max-width: 770px) and (min-width: 481px) {
.policy01{
	display: none;
}
.box04{
	width: 90%;
	float: right;
	background: url(./images/policy01.png) no-repeat;
	background-position: bottom left;
	padding: 0 5%;
	background-size: 40%;
}
.box04 dt, .box04 dd{
	width: 65%;
	float: right;
}

.policy02{
    width: 35%;
    float: right;
    margin: 0 0 5% 0;
}
.box05{
	width: 45%;
	float: right;
	padding: 0px 20px;
}
.policy03{
	clear: both;
    width: 25%;
    float: left;
    margin: 10% 5% 0 0;
}
.box06{
	width: 65%;
	float: left;
}
}

@media screen and (max-width: 481px) {
.policy {
    position: absolute;
    left: -13px;
    margin-left: 0;
    top: -58px;
    width: 142px;
}
.policy01{
	display: none;
}
.box04{
	background: url(./images/policy01.png) no-repeat;
    background-position: bottom right;
    padding: 0 5%;
    background-size: 37%;
}
.box04 dt, .box04 dd{
	width: 100%;
}
.policy02{
	display: none;
}
.box05{
	padding: 5% 0 5% 30%;
	background: url(./images/policy02.png) no-repeat;
    background-position: bottom left;
    background-size: 37%;
}
.policy03{
	display: none;
}
.box06{
	padding: 5% 5% 0% 5%;
	background: url(./images/policy03.png) no-repeat;
    background-position: bottom right;
    background-size: 37%;
}
}








/* ========== Policy ========== */

/* 画面サイズが1050px以下の場合に適用 */
@media only screen and (max-width: 1050px) {
	.cnt05{
		padding: 5%;
	}	
}
.cnt05 h2{
	text-align: center;
}
.cnt05 dl{
	clear: both;
	margin-bottom: 60px;
}
.cnt05 dl dt img{
	width: 100%;
}
.cnt05 ul li{
	margin-bottom: 10px;
}
.btn{
	background: #fcee90;
	color: #000;
	text-decoration: none;
	padding: 10px 35px;
	text-align: center;
	font-size: 90%;
}
@media only screen and (min-width: 631px) {
	.cnt05 dl dt{
		width: 49%;
		float: left;
	}
	.cnt05 dl dd{
		width: 45%;
		float: right;
		margin: 0;
		padding: 2% 0;
	}
}
@media only screen and (max-width: 630px) {
	.cnt05 dl dt{
		width: 100%;
	}
	.cnt05 dl dd{
		width: 100%;
		margin: 0;
		padding: 2% 0;
	}
	.btn{
		display: block;
	}
	.cnt05 dl{
	margin-bottom: 30px;
	}
}


/* ========== Contact ========== */
.cnt06{
	background: #d8eaf5;
	margin-bottom: 90px;
}
.cnt06 h3{
	text-align: center;
}