@charset "utf-8";
/* CSS Document */
.spBlock {
    display: none !important;
}
.pcBlock {
    display: block !important;
}
@media screen and (max-width:899px) {
    .spBlock {
        display: block !important;
    }
    .pcBlock {
        display: none !important;
    }
}
#all-wrap {}
#all-wrap .contents-wrapper {}
#all-wrap section {
	width: 1000px;
    margin: 0 auto;
}
#all-wrap section#sec01 {
	margin-bottom: 50px;
}
#all-wrap section.wid100 {
	width: 100%;
}
#all-wrap section.bg-blue {
	background-color: #C6EDEE;
}
#all-wrap section img {
	width: 100%;
	vertical-align: bottom;
}
#all-wrap #kv {
	background-image: url(../img/pc/apalight-52.jpg);
    width: 100%;
    padding: 50px;
    box-sizing: border-box;
	margin-bottom: 60px;
}
#all-wrap #kv .kv-wrapper {
	position: relative;
	height: 550px;
	overflow: hidden;
	background-color: #41c4c7;
    width: 1080px;
    margin: 0 auto;
}
#all-wrap #kv .kv-wrapper .kv-ttl {
	width: 50%;
	position: absolute;
	bottom: 10px;
	left: 10px;
	z-index: 2;
}
#all-wrap #kv .kv-wrapper .kv-item {
	width: 50%;
	position: absolute;
	right: 20px;
	top: 100px;
	z-index: 2;
}
@keyframes bg-color {
  0% { background: #f3e473;width: 0; }
  100% { background: #f3e473;width: 100%; }
}
#all-wrap #kv .kv-wrapper .bg-anim {
	animation: bg-color 1s 1s ease-in-out normal forwards;
	z-index: 1;
	position: absolute;
	width: 100%;
	height: 65%;
    bottom: -115px;
	transform: skewY(-10deg);
}
#all-wrap .img-wrapper {
	padding: 30px 0;
}
#all-wrap .img-flex-wrapper {
	display: flex;
    justify-content: space-around;
    padding: 30px 0;
}
#all-wrap .img-flex-wrapper.padding0 {
	padding: 0;
}
#all-wrap .img-flex-wrapper.padding80 {
	padding: 80px 0;
}
#all-wrap .img-flex-inner {
	width: 48%;
}
#all-wrap .img-flex-inner.wid40 {
	width: 40%;
}
#all-wrap .img-flex-inner.wid44 {
	width: 44%;
}
#all-wrap .img-flex-inner.wid53 {
	width: 53%;
}
#all-wrap .img-flex-inner.wid55 {
	width: 55%;
}
#all-wrap .margin-t-60 {
	margin-top: -60px;
}
#all-wrap h2 {
	background-color: #41c4c7;
	width: 100%;
	margin-bottom: 20px;
}
#all-wrap h2 .img-wrapper {
	width: 770px;
	margin: 0 auto;
	padding: 100px 0 40px;
	position: relative;
}

#all-wrap h2 .img-wrapper::after {
	content: "";
	width: 0;
	height: 0;
	border-style: solid;
	border-width: 40px 134px 0 134px;
	border-color: #ffffff transparent transparent transparent;
	position: absolute;
	top: 0;
	z-index: 1;
	margin: auto;
    left: 0;
    right: 0;
}
#all-wrap h2.ptn2 .img-wrapper {
	width: 770px;
	margin: 0 auto;
	padding: 50px 0;
	position: relative;
}

#all-wrap h2.ptn2 .img-wrapper::after {
	content: "";
	width: 0;
	height: 0;
	border-style: solid;
	border-width: 40px 134px 0 134px;
	border-color: #41c4c7 transparent transparent transparent;
	position: absolute;
	bottom: -40px;
	top: auto;
	z-index: 1;
	margin: auto;
    left: 0;
    right: 0;
}
#all-wrap h2.ptn4 {
	background-color: unset;
}
#all-wrap h2.ptn4 .img-wrapper {
	width: 450px;
    padding: 0 0 50px;
    margin-top: -100px;
}
#all-wrap h2.ptn4 .img-wrapper::after {
	content: none;
}
#all-wrap h2.inbox {
	background-color: unset;
    margin-bottom: 0;
}
#all-wrap h2.inbox .img-wrapper {
	width: 500px;
    padding: 70px 0 40px;
}
#all-wrap h2.inbox .img-wrapper::after {
	content: none;
}
#all-wrap .wid100outer {
	position: relative;
}
#all-wrap .wid100inner {
	width: 1000px;
    margin: 0 auto;
}
#all-wrap .img-flex-wrapper .minus-right {
	margin-right: -460px;
    width: 830px;
	margin-top: -90px;
}
#all-wrap .img-flex-wrapper.single-left {
	justify-content: flex-start;
}
#all-wrap .img-flex-wrapper.single-left .absolute-right {
	position: absolute;
	right: 0;
}
#all-wrap .bg-wrapper {
	background-image: url(../img/pc/apalight-56.jpg);
    position: relative;
    height: 670px;
    background-repeat: no-repeat;
    background-size: cover;
}
#all-wrap .bg-wrapper .allcenter {
	display: flex;
    align-items: center;
	justify-content: center;
}
#all-wrap .bg-wrapper .bg-inner {
	background-color: rgba(255,255,255,0.5);
    position: relative;
    width: 980px;
    justify-content: flex-end;
    display: flex;
    padding: 30px;
    box-sizing: border-box;
}
#all-wrap .bg-wrapper .bg-inner .img-flex-wrapper {
}
#all-wrap .bg-wrapper .absolute-l {
	position: absolute;
    left: -140px;
    width: 52%;
    bottom: 0;
}
#all-wrap .bg-wrapper .absolute-c {
	width: 24%;
    position: absolute;
    left: 19%;
}
#all-wrap h3 {
	color: #37b4b9;
    font-size: 26px;
    font-weight: bold;
	text-align: center;
	margin-bottom: 10px;
}
#all-wrap h3.ptn2 {
	line-height: 1.5;
    text-align: left;
    color: #231815;
}
#all-wrap h3.ptn3 {
    line-height: 1.5;
    color: #231815;
}
#all-wrap p {
	color: #231815;
    font-size: 17px;
    padding: 5px 0;
    font-family: 'Noto Sans JP', sans-serif;
    line-height: 1.8!important;
}
#all-wrap .border-box {
	border: 2px solid #37b4b9;
    padding: 40px 40px 0px;
    box-sizing: border-box;
	margin-bottom: 70px;
}
#all-wrap .border-box .img-flex-wrapper {
	justify-content: space-between;
}
#all-wrap .caution {
	font-size: 13px;
    text-align: right;
    display: block;
    margin-top: 5px;
}
#all-wrap h2.ptn3 {
	font-size: 37px;
    color: #231815;
    font-weight: bold;
    background-color: unset;
    line-height: 1;
    padding: 40px 0;
    text-align: center;
    margin-bottom: 0;
}
#all-wrap h2.ptn5 {
	background-color: #41c4c7;
    width: 100%;
    text-align: center;
    padding: 50px 0;
    font-weight: bold;
    font-size: 37px;
    color: #fff;
}
#all-wrap ul {
	list-style: none;
}
#all-wrap ul li {}
#all-wrap ul.box-list {
	width: 910px;
    margin: 0 auto;
}
#all-wrap ul.box-list li {
	background-color: #fff;
    margin-bottom: 90px;
	position: relative;
}
#all-wrap ul.six-img-list {
	display: flex;
    justify-content: space-around;
    align-items: center;
}
#all-wrap ul.six-img-list li {
	width: 15.6%;
}
#all-wrap ul.six-img-list.wrap {
	flex-wrap: wrap;
	margin: 0 auto;
}
#all-wrap ul.six-img-list.wrap li {
	width: 32%;
    margin-bottom: 12px;
}
#all-wrap ul.three-img-list {
	display: flex;
    justify-content: space-between;
}
#all-wrap ul.three-img-list li {
	width: 32%;
}
#all-wrap ul.three-img-list li h4 {
	color: #fff;
    background-color: #41c4c7;
    text-align: center;
    font-size: 20px;
    padding: 10px 0;
    font-family: 'Noto Sans JP', sans-serif;
}
#all-wrap ul.box-list li::after {
	content: "";
	width: 0;
	height: 0;
	border-style: solid;
	border-width: 40px 134px 0 134px;
	border-color: #41c4c7 transparent transparent transparent;
	position: absolute;
	bottom: -67px;
	top: auto;
	z-index: 1;
	margin: auto;
    left: 0;
    right: 0;
}
#all-wrap ul.box-list li:last-of-type {
	margin-bottom: 0;
}
#all-wrap ul.box-list li:last-of-type::after {
	content: none;
}
#all-wrap .padding-b90 {
	padding-bottom: 90px;
}
#all-wrap .padding-t80 {
	padding-top: 80px;
}
#all-wrap .padding-0 {
	padding: 0px;
}
#all-wrap .margin-b20 {
	margin-bottom: 20px;
}
#all-wrap .margin-b30 {
	margin-bottom: 30px;
}
#all-wrap .margin-t10 {
	margin-top: 10px;
}
#all-wrap .wid1200 {
	width: 1200px;
	margin: 0 auto;
}
#all-wrap .wid20 {
	width: 20%;
}
#all-wrap .wid30 {
	width: 30%;
}
#all-wrap .wid55 {
	width: 55%;
}
#all-wrap .wid80 {
	width: 80%;
}
#all-wrap .wid500 {
	width: 500px;
	margin: 0 auto 20px;
}
#all-wrap .free {
	text-align: center;
	margin: 0 auto 20px;
}
#all-wrap .box1 {
	background-color: #C6EDEE;
    border-radius: 10px;
    padding: 25px 20px 20px;
}
#all-wrap .img-flex-inner .box1 h3 {
	width: 80%;
	margin: 0 auto;
}
section#offer {
	margin: 0 auto 80px;
}
#offer .offer-wrapper {
	border: 2px solid;
}
#offer .offer-wrapper {}
#offer .offer-wrapper {}
#offer .offer-wrapper p {
	font-size: 16px;
}
#offer .offer-wrapper h2 {
	font-size: 29px;
    background-color: unset;
    font-family: serif;
    color: #231815;
    font-weight: bold;
}
#offer .offer-wrapper .offer-flex {
	display: flex;
	justify-content: space-between;
}
#offer .offer-wrapper .offer-flex .volume {
	color: #231815;
    font-size: 16px;
    font-family: 'Noto Sans JP', sans-serif;
    margin-left: 4px;
    line-height: 1;
}
#offer .offer-wrapper .offer-flex .offer-btn {}
#offer .offer-wrapper .offer-flex .offer-btn a {
	color: #fff;
    background-color: #37b4b9;
    padding: 10px 50px;
    border-radius: 30px;
	text-decoration: none;
	transition: 0.3s;
	display: block;
}
#offer .offer-wrapper .offer-flex .offer-btn a:hover {
	opacity: 0.6;
}
@media screen and (max-width:899px) {
	#all-wrap #kv {
		background-image: unset;
		padding: 0;
		margin-bottom: 5%;
	}
	#all-wrap #kv .kv-wrapper {
		width: 100%;
		height: auto;
	}
	#all-wrap #kv .kv-wrapper .kv-ttl {
		width: 65%;
		position: relative;
		margin: 15% auto 5%;
		left: 0;
	}
	#all-wrap #kv .kv-wrapper .kv-item {
		width: 94%;
		position: relative;
		right: 0;
		left: 0;
		top: auto;
		bottom: 5%;
		z-index: 2;
		margin: auto;
		padding-bottom: 3%;
	}
	#all-wrap #kv .kv-wrapper .kv-item img:last-of-type {
		margin-top: -12%;
	}
	#all-wrap #kv .kv-wrapper .bg-anim {
		bottom: -30%;
	}
	#all-wrap section {
		width: 100%;
		padding: 0 3%;
		box-sizing: border-box;
	}
	#all-wrap section#sec01 {
		margin-bottom: 5%;
	}
	#all-wrap .img-wrapper {
		padding: 3% 0;
	}
	#all-wrap h2 .img-wrapper {
		width: 100%;
		padding: 5% 0 3%;
	}
	#all-wrap section.wid100 {
		width: 100%;
		padding: 0;
	}
	#all-wrap .wid100inner {
		width: 100%;
		padding-bottom: 10%;
	}
	#all-wrap h2 .img-wrapper::after {
		border-width: 30px 90px 0 90px;
	}
	#all-wrap .wid100inner .img-wrapper {
		padding: 3%;
	}
	#all-wrap .wid100inner .three-img-list {
		padding: 3%;
	}
	#all-wrap p {
		font-size: 15px;
	}
	#all-wrap h3.img-h3 {
		width: 80%;
    	margin: 0 auto 3%;
	}
	#all-wrap ul.six-img-list.wrap {
		width: 92%;
	}
	#all-wrap ul.six-img-list.wrap li {
		width: 48%;
		margin-bottom: 2%;
	}
	#all-wrap .wid70 {
		width: 70%;
		margin: 0 auto;
	}
	#all-wrap .bg-inner-flex {
		display: flex;
		justify-content: space-between;
	}
	#all-wrap .bg-wrapper .bg-inner {
		width: 90%;
		display: block;
		padding: 0;
		margin-bottom: 10%;
	}
	#all-wrap .bg-wrapper .absolute-l {
		position: relative;
		left: 0;
		width: 90%;
		bottom: 0;
		margin-left: -17%;
	}
	#all-wrap .bg-wrapper .absolute-c {
		width: 55%;
		position: absolute;
		right: 4%;
		margin-top: 5%;
		left: auto;
	}
	#all-wrap .img-wrapper2 {
		padding: 3% 5%;
	}
	#all-wrap h3.ptn2 {
		line-height: 1.5;
		text-align: center;
		color: #231815;
		font-size: 18px;
		margin-bottom: 0;
	}
	.padding-t6per {
		padding-top: 6%;
	}
	#all-wrap h2.inbox .img-wrapper {
		width: 80%;
		padding: 10% 0;
		box-sizing: border-box;
	}
	#all-wrap .bg-wrapper {
		background-image: url(../img/sp/apalight-bg-sp.jpg);
		background-color: #eaeef4;
		height: auto;
		background-size: 100%;
	}
	#all-wrap ul.list-100 {
		padding: 3%;
		box-sizing: border-box;
	}
	#all-wrap ul.list-100 li {
		padding: 1.5% 0;
	}
	#all-wrap h2.ptnimg {
		background-color: unset;
	}
	#all-wrap .border-box {
		border: 2px solid #37b4b9;
		padding: 6% 4% 2%;
		width: 92%;
		margin: 0 auto;
	}
	#all-wrap .border-box .img-wrapper {
		padding: 3% 0;
	}
	#all-wrap h3 {
		font-size: 19px;
	}
	#all-wrap ul.box-list {
		width: 92%;
	}
	#all-wrap h2.ptn3 {
		font-size: 24px;
		padding: 10% 0;
	}
	#all-wrap ul.box-list li {
		margin-bottom: 60px;
	}
	#all-wrap ul.box-list li::after {
		border-width: 25px 40px 0 40px;
		bottom: -45px;
	}
	#all-wrap .wid1200 {
		width: 100%;
		margin: 0 auto;
		padding: 0;
	}
	#all-wrap h2.ptn4 .img-wrapper {
		width: 70%;
		padding: 0;
		margin-top: 0;
	}
	#all-wrap .wid20.free {
		width: 35%;
		margin: 6% auto 4%;
	}
	#all-wrap ul.six-img-list {
		flex-wrap: wrap;
		padding: 0 2%;
	}
	#all-wrap ul.six-img-list li {
		width: 31%;
		margin-bottom: 2%;
	}
	#all-wrap .wid100inner .three-img-list.wrap {
		padding: 0 3%;
		flex-wrap: wrap;
		box-sizing: border-box;
	}
	#all-wrap .wid100inner .three-img-list.wrap li {
		width: 100%;
    	margin-bottom: 5%;
	}
	#all-wrap .wid100inner .three-img-list.wrap li:last-of-type {
    	margin-bottom: 0;
	}
	#all-wrap .padding-t80 {
		padding-top: 10%;
	}
	#all-wrap .wid500 {
		width: 80%;
		margin: 0 auto 10px;
	}
	#offer .offer-wrapper {
		padding: 3% 3% 6%;
	}
	#offer .offer-wrapper .offerkv {
		width: 70%;
		margin: 0 auto;
	}
	#offer .offer-wrapper h2 {
		font-size: 26px;
		margin-bottom: 2%;
		line-height: 1.3;
		text-align: center;
		font-family: 'Noto Sans JP', sans-serif;
	}
	#offer .offer-wrapper .offer-flex {
		display: block;
	}
	#offer .offer-wrapper .offer-flex .volume {
		font-size: 14px;
		margin-left: 0;
		text-align: center;
		margin-bottom: 5%;
	}
	#offer .offer-wrapper .offer-flex .offer-btn a {
		padding: 3%;
		text-align: center;
	}
}