﻿@charset "utf-8";
/***  メインビジュアル　フェード  ***/

#top01,
#top02,
#top03,
#top04,
#top05,
#top06,
#top07,
#top08 {
	width:90%;
	margin:0 auto;
	text-align:left;
	padding:2em 0;
}

.news_block{
	border:#D6D6D6 1px solid;
	background:#FFFFFF;
	box-sizing: border-box;
	padding:1em;
	font-size: 90%;
	max-width: 800px;
	width:90%;
	margin:2em auto;
}

.video_block{
    position:relative;
    padding-bottom: 83.333333%; /* 100/300*200　*/
    height: 0;
    overflow: hidden;
    z-index: 1;
}
video{
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}
.video_block::after{
    position: absolute;
    left:0;
    top:0;
    content: '';
    width:100%;
    height:100%;
    background:url(../img/top/ami.png) repeat;
    z-index: 2;
}

.video_on{
    width:80%;
    position: absolute;
    top: 50%;
    left: 50%;
    -webkit-transform: translate(-50%, -50%); /* Safari用 */
    transform: translate(-50%, -50%);
    z-index: 3;
}

.mainasu{
	margin:-2.5em 0 0 0;
	position: relative;
	z-index: 10;
}
.mainasu_02{
	margin:-5em 0 0 0;
}
.mainasu_03{
	margin:-4em 0 0 0;
	position: relative;
	z-index: -1;
}

.mainasu_04{
	margin:-3em 0 0 0;
	position: relative;
	z-index: 3;
}
.mainasu_05{
	margin:-6em 0 0 0;
	position: relative;
	z-index: 3;

}

/**** メインコンテンツ　****/
.top01bg{
	background:url(../img/top/top01bg.png) no-repeat 0 2em;
	background-size: 100% auto;
}
/* .top03bg{
	background:url(../img/top/top_06_bg.png) no-repeat top;
	background-size: 100% auto;
} */

.top01_01{
	max-width: 1200px;
	width: 100%;
	margin:0 auto;
}

.top01_01l{/*1600 432*/
	max-width:432px;
	width:100%;
	margin:1em auto;
	float: none;
}
.top01_01r{/*1600 682*/
	max-width:682px;
	width:90%;
	margin:0 5%;
	float: none;
}

.top01_02{
	max-width: 1600px;
	margin:0 auto;
}
.top01_02>ul>li{
	width:88%;
	float: left;
	margin:1.5em 7% 1.5em 5%;
	padding:1em 1%;
	box-sizing: border-box;
	background:#FFFFFF;
	box-shadow: 4px 4px 10px rgba(0,0,0,0.15);/*縦横ぼかし*/
	position: relative;
}

.rank01,
.rank02,
.rank03{
	position: absolute;
	width:20%;
	top:0;
	left:1em;
	z-index: 5;
}

.top01_02fee{
	background:#F9E8F4;
	border-radius: 50px;
	padding:0.3em 1.3em;
	margin:0 0.3em;
}
.top01_03fee{
	background:#F9E8F4;
	border-radius: 10px;
	padding:0.3em 1.5em;
	margin:0 0.3em;
}

.top01_02bg{
	padding:5em 0;
	background: url(../img/top/top_05_img.png) no-repeat right top;
	background-size: contain;
}




.top01_01more a{
	display: block;
	background:#0059B2;
	padding:0.6em 0;
	text-align: center;
	color:#FFFFFF;
	border:#0059B2 1px solid;
	border-radius: 50px;
	text-decoration: none;
	-webkit-transition: .2s ease-in-out;
	transition: .2s ease-in-out;
}

.top01_01more a:hover{
	color:#0059B2;
	background:none;
}

.slid_div{
	width:96%;
	margin:0 2%;
}

.top02_01{
	width:100%;
	max-width: 1600px;
	margin:0 auto;
}
.top02_01>ul>li{/*1600 670*/
	width:96%;
	background:#B40F0F;
	float: left;
	padding:1em 1%;
	box-sizing: border-box;
}
.top02_01>ul>li:nth-child(odd),
.top02_01>ul>li:nth-child(even){/*1600 670*/
	margin:1em 2%;
}

.top02_01>ul>li>ul>li{/*638 273*/
	width:42.7899%;
	float: left;
}

.top02_01>ul>li>ul>li:nth-child(odd){/*1600 670*/
	margin:0.2em 1% 0.2em 6.2%;
}
.top02_01>ul>li>ul>li:nth-child(even){/*1600 670*/
	margin:0.2em 6.2% 0.2em 1%;
}

.top02_02>ul>li{/*1248 1050*/
	max-width:1248px;
	width:96%;
	margin:2em 2%;
	/* background:#B40F0F; */
	padding:1.5em 2%;
	box-sizing: border-box;
}

.top02_02>ul>li>ul>li{/*1050 340*/
	width:48%;
	float: left;
	margin:0 1%;
}

.top03_01>ul>li{
	width:46%;
	margin:0 2% 2em;
	float: left;
}

.top04_01{
	max-width: 1600px;
	margin:0 auto;
	text-align: center;
}
.top04_01>ul{
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
}
.top04_01>ul>li{
	width:90%;
	margin:2em 5% 1em 5%;
	float: left;
	background:#FFFFFF;
	border-radius: 15px;
	padding:1.5em 3%;
	box-sizing: border-box;
	box-shadow: 4px 4px 10px rgba(0,0,0,0.15);/*縦横ぼかし*/

}

.top05_01>ul>li{
	width:94%;
	margin:1.5em 1% 0 4%;
	float: left;
}

.top06_01more {
	position: relative;
	display: inline-block;
	padding:0 2em 0 0;
}
.top06_01more::after{
	content: '';
	background:url(../img/icon/icon_arrow.svg) no-repeat;
	background-size: contain;
	width:9px;
	height:9px;
    position: absolute;
    top: 50%;
    right: 1%;
    transform: translate(-50%,-50%);
}

.top_06_02>ul>li>dl{
    display: table;
    width:100%;
    table-layout: fixed;
	padding:1.5em 0;
	border-bottom: #D6D6D6 1px solid;
}
.top_06_02>ul>li>dl>dt{
	display: table-cell;
	vertical-align:middle;
	width:27.47%;/*250 910*/

}
.top_06_02>ul>li>dl>dd{
	display: table-cell;
	vertical-align:middle;
	width:72.53%;/*250 910*/
	padding:0 2em;

}


/*インスタグラム*/
#instafeed>li {
	float:left;
	width:30%;
	margin:0 1.5% 2em 1.5%;
}

.top07_01>ul>li{
	width:96%;
	margin:1em 2%;
	float: left;
}

/*========================
	マップ
========================*/


.map_block {
	position:relative;
	padding-bottom: 58.7719%; /* 100/横*縦*/
	height: 0;
	overflow: hidden;
}

.map_block iframe {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
}


.top01_01smn{
	position: relative;
	width: 100%;
	overflow: hidden;
	background:#EEEEEE;
}
.top01_02smn{
	position: relative;
	width: 100%;
	overflow: hidden;
}

.top01_01smn::before{
    content:"";
    display: block;
    padding-top:71.8181%; /*アスペクト比*/
}

.top01_02smn::before{
    content:"";
    display: block;
    padding-top:79.1489%; /*アスペクト比*/
}
.top01_01smn a,
.top01_01smn span,
.top01_02smn a,
.top01_02smn span{
        display: block;
        width:100%;
        height:100%;
        max-height:100%;
}

.top01_01smn img,
.top01_02smn img{
        width:auto;
        height:auto;
        max-width: 100%;
        max-height: 100%;
        margin:auto;
        position: absolute;
        top: 50%;
        left: 50%;
        -webkit-transform: translate(-50%, -50%); /* Safari用 */
        transform: translate(-50%, -50%);
}

.top_aio_field dl {
	width: 90%;
	margin: 0 auto 1.5em;
	color: #FFFFFF;
	font-size: 80%;
}
.top_aio_field dl>dt {
	font-size:120%;
	font-weight: bold;
	margin-bottom: 0.5em;
	display: inline-block;
}

/*=================================================================================*/
/** 768px以上　タブレット縦　サイズ画面  **/
@media (min-width : 768px) {
/***  メインビジュアル　フェード  ***/
.video_on{
	width:50%;
}

#top01,
#top02,
#top03,
#top04,
#top05,
#top06,
#top07,
#top08  { width:100%; }

.video_block{
    padding-bottom: 49%; /* 100/300*200　*/
}

/**** メインコンテンツ　****/

.news_block{
	padding:2em 3em;
	font-size:90%;
}
	
.top01_01l{/*1600 432*/
	max-width:432px;
	width:36%;
	margin:4em 1.5% 0 2.083%;
	float: left;
}
.top01_01r{/*1600 682*/
	max-width:682px;
	width:56.8333%;
	margin:0 1.083% 0 2.5%;
	float: left;
}

.top01_02>ul>li{
	width:31%;
	float: left;
	margin:1.5em 1% 2em;
	box-shadow: 14px 14px 20px rgba(0,0,0,0.15);/*縦横ぼかし*/
}
.rank01,
.rank02,
.rank03{
	width:auto;
	left:3em;
}

.top02_01>ul>li{/*1600 670*/
	width:41.875%;
}
.top02_01>ul>li:nth-child(odd){/*1600 670*/
	margin:1em 1% 1em 7%;
}
.top02_01>ul>li:nth-child(even){/*1600 670*/
	margin:1em 7% 1em 1%;
}

.top02_02>ul>li{/*1248 1050*/
	width:100%;
	margin:2em auto;
	padding:1.5em 5%;
}

.top02_02>ul>li>ul>li{
	width:32.38%;
	margin:0 0.4%;
}

.top03_01>ul>li{
	width:21.4912%;
	margin:0 1.7543% 2em;
}

.top04_01>ul>li{
	width:31%;
	margin:2.5em 2% 2.5em 0;
	box-shadow: 14px 14px 20px rgba(0,0,0,0.15);/*縦横ぼかし*/

}

.top05_01>ul>li{
	width:46.4912%;
	margin:1em 1.7543%;
	float: left;
}


/*インスタグラム*/
#instafeed>li {
	float:left;
	width:15%;
	margin:0 2% 2em 0;
}

#instafeed>li:nth-child(6){
	margin:0 0 2em 0;
}

/*
.top07_01>ul>li{
	width:46.4912%;
	margin:1em 1.7543%;
	float: left;;

}
*/
.top_aio_field dl {
	font-size: 100%;
	width: 80%;
}

}
/*=================================================================================*/
/** 1140px以上 padding: ;PCサイズ画面 **/

@media (min-width : 1140px) {



#top01,
#top02,
#top03,
#top04,
#top05,
#top06,
#top07,
#top08   { width:1140px; padding:40px 0; }


/**** メインコンテンツ　****/

.video_on{
	width:40%;
}






}

@media (min-width : 1600px) {

.mainasu_02{
	margin:-11em 0 0 0;
}



}

@media (min-width : 1800px) {

	.video_on{
		width:auto;
	}

}

#sb_instagram svg:not(:root).svg-inline--fa {
	display:none !important;
}