#main {
	margin-bottom: 0;
}
@media screen and (max-width: 910px) {
	#main {
		margin-bottom: 0;
    }
}
@media screen and (max-width: 680px) {
	#main {
		margin-bottom: 0;
    }
}
/* --------------------------------------------------- */
#main-visual {
	width: 100%;
	margin: 0 auto;
	position: relative;
	padding-bottom: 140px;
}
#main-visual .inner {
	max-width: 1600px;
	width: 100%;
	margin: 0 auto;
	position: relative;
}
#main-visual .mv-ttl {
	max-width: 210px;
	width: 20%;
	position: absolute;
	top: 0;
	left: 7%;
	z-index: 4;
}
#main-visual .right {
	max-width: 950px;
	width: 70%;
	margin: 0 -30px 0 auto;
}
#main-visual .ph-set {
	width: 100%;
	padding-top: 125%;
	position: relative;
}
#main-visual .ph-set .ph1,
#main-visual .ph-set .ph2,
#main-visual .ph-set .ph3,
#main-visual .ph-set .ph4,
#main-visual .ph-set .ph5,
#main-visual .ph-set .ph6 {
	position: absolute;
}
#main-visual .ph-set .ph1 {
	width: 39.46%;
	top: 0;
	left: 0;
}
#main-visual .ph-set .ph2 {
	width: 30%;
	top: 7.6%;
	left: 42.55%;
}
#main-visual .ph-set .ph3 {
	width: 24.46%;
	top: 12.03%;
	right: 0;
}
#main-visual .ph-set .ph4 {
	width: 57.76%;
	top: 34.45%;
	left: 0;
}
#main-visual .ph-set .ph5 {
	width: 39.15%;
	top: 34.45%;
	right: 0;
}
#main-visual .ph-set .ph6 {
	width: 39.15%;
	right: 0;
	bottom: 0;
}

#main-visual .ph-set div img {
    opacity: 0;
    display: block;
    animation: none 0s backwards;
    transition: opacity 1.8s ease;
}
#main-visual .ph-set div.show img {
    opacity: 1;
}
#main-visual::after {
	content: "";
	width: 100%;
	height: 227px;
	background: url("../images/common/kumo.png") no-repeat center top;
	background-size: 1694px;
	position: absolute;
	bottom: -2px;
	left: 0;
	z-index: 3;
}
#main-visual .mv-btn {
	display: block;
	max-width: 330px;
	width: 40%;
	
	transform: rotate(15deg);
	left: 25%;
	bottom: 0;
	z-index: 5;
	position: absolute;
}
#main-visual .mv-btn:hover {
	transform: rotate(0deg);
}


#main-visual .cube1,
#main-visual .cube2,
#main-visual .cube3,
#main-visual .cube4 {
	position: absolute;
	z-index: 4;
}
#main-visual .cube1 {
	max-width: 126px;
	width: 12%;
	right: 27%;
	top: 50px;
}
#main-visual .cube2 {
	max-width: 188px;
	width: 18%;
	transform: rotate(28deg);
	right: 12%;
	top: 29%;
}
#main-visual .cube3 {
	max-width: 188px;
	width: 18%;
	transform: rotate(-27deg);
	left: 40%;
	top: 55%;
}
#main-visual .cube4 {
	max-width: 70px;
	width: 7%;
	transform: rotate(16deg);
	top: 75%;
	right: 25%;
}
#main-visual .cube1 img {
	transition-delay: .6s;
}
#main-visual .cube2 img {
	transition-delay: .5s;
}
#main-visual .cube3 img {
	transition-delay: .4s;
}
#main-visual .cube4 img {
	transition-delay: .7s;
}

@media print, screen and ( max-width : 1300px ) {
}
@media screen and (max-width: 910px) {
	#main-visual::after {
        height: 121px;
        background-size: 920px;
    }
}
@media screen and (max-width: 680px) {
	#main-visual {
        padding-bottom: 50px;
    }
	#main-visual::after {
        height: 91px;
        background-size: 680px;
    }
	#main-visual .mv-ttl {
        width: 23%;
        left: 7%;
		top: -30px;
    }
	#main-visual .mv-btn {
        width: 35%;
        left: 30%;
        bottom: -20px;
    }
}
/* --------------------------------------------------- */
#sec01 {
	width: 100%;
	background-color: #fff;
	padding: 100px 5% 150px;
	position: relative;
	margin-bottom: 150px;
}

#sec01 .cube1,
#sec01 .cube2,
#sec01 .cube3,
#sec01 .cube4,
#sec01 .cube5 {
    opacity: 0;
    transform: translate(0, 0) scale(0.6);
    transition: opacity 1.2s ease, transform 1.2s ease;
}

/* 位置ごとに “中心へ寄せる” 初期位置を調整 */
#sec01 .cube1 { transform: translate(80px, -80px) scale(0.6); }
#sec01 .cube2 { transform: translate(60px, 20px) scale(0.6); }
#sec01 .cube3 { transform: translate(50px, 100px) scale(0.6); }
#sec01 .cube4 { transform: translate(-80px, -40px) scale(0.6); }
#sec01 .cube5 { transform: translate(-100px, 120px) scale(0.6); }

/* 発動後：元の位置に戻る */
#sec01 .cube-show {
    opacity: 1;
    transform: none;
	transform: translate(0,0) scale(1) rotate(var(--r));
}

#sec01 .cube1,
#sec01 .cube2,
#sec01 .cube3,
#sec01 .cube4,
#sec01 .cube5 {
	position: absolute;
	z-index: 0;
}
#sec01 .cube1 {
	max-width: 160px;
	width: 16%;
	--r: 28deg;
	bottom: 55%;
	left: -35px;
}
#sec01 .cube2 {
	max-width: 60px;
	width: 6%;
	--r:  0deg;
	top: 50%;
	right: 85%;
}
#sec01 .cube3 {
	max-width: 160px;
	width: 16%;
	--r: -27deg;
	bottom: -60px;
	left: 5%;
}
#sec01 .cube4 {
	max-width: 160px;
	width: 16%;
	--r: -27deg;
	bottom: 50%;
	right: -30px;
}
#sec01 .cube5 {
	max-width: 250px;
	width: 25%;
	--r: 28deg;
	bottom: -60px;
	right: 5%;
}
#sec01 .title {
	text-align: center;
	font-size: 1.4em;
	font-weight: 600;
	line-height: 1.5em;
	margin-bottom: 40px;
	position: relative;
	z-index: 1;
}
#sec01 .title > span {
	display: inline-block;
	font-weight: 700;
	position: relative;
}
#sec01 .title > span:nth-child(2) {
	margin: 0 10px;
	padding: 0 15px;
}
#sec01 .title > span:nth-child(2)::before,
#sec01 .title > span:nth-child(2)::after {
	content: "";
	width: 1px;
	height: 100%;
	background-color: #41455A;
	transform: rotate(25deg);
	position: absolute;
	top: 0;
	bottom: 0;
}
#sec01 .title > span::before {
	left: 0;
}
#sec01 .title > span::after {
	right: 0;
}
#sec01 .title strong {
	display: block;
	text-align: center;
	font-family: "RocknRoll One", sans-serif;
	font-weight: 400;
	font-size: 2.3em;
	letter-spacing: 6px;
	margin-top: 20px;
}
#sec01 .title strong > span {
	display: inline-block;
	font-size: .7em;
}
#sec01 p {
	max-width: 600px;
	width: 95%;
	margin: 0 auto;
	position: relative;
	z-index: 1;
}
#sec01 .title_catch {
	font-size: 120%;
	font-weight: bold;
}
@media print, screen and ( max-width : 1300px ) {
}
@media screen and (max-width: 910px) {
}
@media screen and (max-width: 680px) {
	#sec01 {
        padding: 20px 5% 60px;
        margin-bottom: 60px;
    }
	#sec01 .cube3 {
        bottom: -30px;
    }
    #sec01 .cube5 {
        bottom: -20px;
    }
	#sec01 .title {
        font-size: 1.2em;
        margin-bottom: 40px;
    }
	#sec01 .title > span,
	#sec01 .title > span:nth-child(2) {
		max-width: 230px;
		width: 100%;
        margin: 0px auto 5px;
		padding-bottom: 7px;
		display: block;
		text-align: center;
		border-bottom: #41455A 1px dashed;
    }
    #sec01 .title > span:nth-child(2)::before,
    #sec01 .title > span:nth-child(2)::after {
		display: none;
    }
	#sec01 .title br {
		display: none;
	}
	#sec01 .title strong {
        font-size: 1.7em;
        letter-spacing: 3px;
        margin-top: 20px;
    }
}
/* --------------------------------------------------- */
#sec02 {
	max-width: 1500px;
	width: 90%;
	margin: 0 auto 150px;
	padding-left: 400px;
	position: relative;
}
#sec02 ul {
}
#sec02 li {
	background-color: #fff;
	padding: 25px 30px;
	display: flex;
	justify-content: flex-start;
	margin-bottom: 10px;
	border-radius: 4px;
}
#sec02 li .day {
	display: inline-block;
	width: 100px;
	font-size: 11px;
	padding-top: 3px;
	opacity: .5;
	margin-right: 10px;
}
#sec02 li a {
	display: inline-block;
	flex: 1;
}
#sec02 li a:hover {
	text-decoration: underline;
}
#sec02 .btn-style01 {
	position: absolute;
	top: 0;
	left: 0;
}
@media print, screen and ( max-width : 1100px ) {
	#sec02 {
		padding-left: 0;
	}
	#sec02 ul {
		margin-bottom: 30px;
	}
	#sec02 .btn-style01 {
		width: 90%;
		position: relative;
		top: auto;
		margin: 0 auto;
	}
}
@media screen and (max-width: 910px) {
}
@media screen and (max-width: 680px) {
	#sec02 {
        margin: 0 auto 70px;
    }
	#sec02 ul {
		margin-bottom: 20px;
	}
	#sec02 li {
        padding: 10px 20px 15px;
		display: block;
    }
	#sec02 li .day {
        width: 100%;
        font-size: 10px;
        padding-top: 0px;
        margin-right: 0;
		margin-bottom: 5px;
    }
}
/* --------------------------------------------------- */
#sec03 {
	max-width: 1500px;
	width: 90%;
	margin: 0 auto 250px;
}
#sec03 .block {
	background-color: #fff;
	position: relative;
	width: 80%;
	padding: 50px;
	border-radius: 10px;
}
#sec03 .block:nth-child(odd) {
	margin: 0 auto 60px 0;
}
#sec03 .block:nth-child(even) {
	margin: 0 0 60px auto;
}
#sec03 .block .inner {
	width: 65%;
}
#sec03 .block:nth-child(odd) .inner {
	margin: 0 auto 0 0;
}
#sec03 .block:nth-child(even) .inner {
	margin: 0 0 0 auto;
}
#sec03 .block .title {
	display: inline-block;
	font-family: "RocknRoll One", sans-serif;
	font-weight: 400;
	font-size: 2em;
	margin-bottom: 20px;
	position: relative;
	border-bottom: #41455A 2px dashed;
}
#sec03 .block .title a:hover {
	color: #aaa;
}
#sec03 .block .title .up {
	display: inline-block;
	width: 40px;
	position: absolute;
	bottom: 40px;
	right: 0;
	transform: rotate(10deg);
}
#sec03 .block .title .mini {
	display: inline-block;
	font-size: .6em;
	margin-left: 5px;
}
#sec03 .block p {
	margin-bottom: 20px;
}
#sec03 .block .subject {
	background-color: #FFF148;
	line-height: 1.4em;
	padding: 9px 15px 10px;
	margin-bottom: 40px;
}
#sec03 .block .btn {
}
#sec03 .block .ph {
	width: 46%;
	position: absolute;
	top: 50%;
	transform: translate(0%, -50%);
}
#sec03 .block:nth-child(odd) .ph {
	left: 70%;
}
#sec03 .block:nth-child(even) .ph {
	right: 70%;
}
@media print, screen and ( max-width : 1300px ) {
	#sec03 .block {
        width: 90%;
        padding: 40px;
    }
}
@media screen and (max-width: 910px) {
	#sec03 {
        width: 95%;
        margin: 0 auto 100px;
    }
	#sec03 .block,
	#sec03 .block:nth-child(odd),
    #sec03 .block:nth-child(even) {
        width: 100%;
        padding: 40px;
		margin: 0 0 30px;
    }
    #sec03 .block .inner,
	#sec03 .block:nth-child(odd) .inner,
	#sec03 .block:nth-child(even) .inner {
        width: 100%;
        margin: 0 0 40px;
    }
	#sec03 .block .ph {
		max-width: 500px;
        width: 100%;
        position: static;
        top: auto;
        transform: translate(0%, 0%);
		margin: 0 auto;
    }
}
@media screen and (max-width: 680px) {
	#sec03 .block,
	#sec03 .block:nth-child(odd),
    #sec03 .block:nth-child(even) {
        padding: 25px;
		margin: 0 0 20px;
    }
	#sec03 .block .title {
		display: block;
        font-size: 1.5em;
        margin-bottom: 20px;
		padding-bottom: 5px;
    }
	#sec03 .block .subject {
        margin-bottom: 20px;
    }
	#sec03 .block .title .up {
		width: 30px;
        bottom: 20px;
        right: -20px;
        transform: rotate(0deg);
    }
}
/* --------------------------------------------------- */
#sec04 {
	position: relative;
	z-index: 9;
	width: 100%;
	background-color: #fff;
	padding: 40px 0 60px;
}
#sec04::before {
	content: "";
	width: 100%;
	height: 227px;
	background: url("../images/common/kumo.png") no-repeat center top;
	background-size: 1694px;
	position: absolute;
	top: -225px;
	left: 0;
}
#sec04 .responsive {
	z-index: 1;
	margin: 50px 0;
}
#sec04 .responsive div {
	padding: 0 20px;
}
#sec04 .responsive div img {
	border-radius: 20px;
}
@media print, screen and ( max-width : 1300px ) {
}
@media screen and (max-width: 910px) {
	#sec04::before {
        height: 121px;
        background-size: 920px;
		top: -120px;
    }
	#sec04 .responsive {
        margin: 30px 0;
    }
	#sec04 .responsive div {
        padding: 0 10px;
    }
}
@media screen and (max-width: 680px) {
	#sec04::before {
        height: 91px;
        background-size: 680px;
		top: -90px;
    }
	#sec04 .responsive {
        margin: 10px 0;
    }
	#sec04 .responsive div {
        padding: 0 5px;
    }
}
/* --------------------------------------------------- */
footer::before {
	display: none;
}
/* --------------------------------------------------- */


