@charset "utf-8";

@media screen and (min-width: 769px) {
	body {
		font-size: 1.8em;/*18px*/
    }
	
	/*margin*/
	.mb20{margin:0 0 20px 0;}
	.mb40{margin:0 0 40px 0;}
	.mb60{margin:0 0 60px 0;}
	.mb80{margin:0 0 80px 0;}

	/*padding*/
	.ptb80{padding: 8rem 0;}
	.ptb140{padding:14rem 0;}

	.contents{
		max-width:1000px;
		width: 86%;
		margin:0 auto;
	}
	
	/*flex*/
	.flex{
		display: flex;
		flex-wrap: wrap;
	}
	.flex-bt{
		justify-content: space-between;
	}
	.align-c{
		align-items: center;
	}
	.order2{order: 2;}

	/*====================================
	 HEADER
	====================================*/

	/*====================================
	 MAIN
	====================================*/
	.main{
		background: url("../images/main_bg.webp") no-repeat center top;
		background-size: cover;
		min-height: 980px;
	}

	.main .contents{
		max-width: 1110px;
	}
	h2{
		font-size: 5.4rem;
	}
	h2 .f-en{
		font-size: 7rem;
	}
	h3{
		font-size: 4rem;
	}
	#wrap .fs-bg{
		font-size: 6rem;
	}
	#wrap .fs-mini{
		font-size: 3rem;
	}
	
	/*cta*/
	.cta .seal-ph{
		margin: 0 auto 4rem;
		width: 70%;
	}
	.cta .product{
		margin: 0 6% 4rem;
	}
	.cta .product .list1 {
		display: flex;
		flex-direction: initial;
		justify-content: center;
	}
	.cta .product .list1 li {
		display: inline-block;
	}
	.cta .product h3 {
		padding: 1.5rem;
		font-size: 3.6rem;
	}
	.cta .gentei {
		font-size: 2.8rem;
	}
	.cta .product ul {
		padding: 2rem;
		gap: 1rem;
	}
	.cta .product .list1 li {
		padding: 0.75rem;
	}
	.cta .product li{
		font-size: 2rem;
	}
	.cta .price-box {
		gap:3rem;
	}
	.cta .price-box .align-c{
		align-items: baseline;
		gap: 1rem;
	}
	.cta .offbox {
		padding: 1rem;
		font-size: 2rem;
	}
	.cta .offbox .per {
		font-size: 5rem;
	}
	.cta .tujo {
		font-size: 2rem;
	}
	.cta .price {
		font-size: 2.4rem;
	}
	.cta .price .num {
		font-size: 7.5rem;
	}
	.cta .product .caution {
		padding: 0 0 4rem;
		text-align: center;
	}
	.cta .tameseru {
		font-size: 2.4rem;
	}
	.cta .num span {
		padding: 0 4rem;
		font-size: 3rem;
	}
	.cta .kit {
		padding: 3rem;
	}
	.cta .kit .plus {
		font-size: 3rem;
		margin: 1rem auto 1.5rem;
	}
	.cta .kit dl{
		display: flex;
		justify-content: flex-start;
	}
	.cta .kit dl h3{
		font-size: 2.8rem;
	}
	.cta .kit dt{
		width: 40%;
	}
	.cta .kit dd {
		width: calc( 60% - 0rem);
		padding: 1rem;
		background: #fff;
		color: #222;
	}
	.cta .kit .bg-brown{
		padding: 1rem 1.5rem;
		background: #F6F2E9;
		color: #A0741F;
	}
	.cta .kaiketsu .contents{
		display: flex;
		justify-content: center;
		align-items: center;
	}
	.cta .kaiketsu h2 {
		font-size: 3.6rem;
	}
	.cta .kaiketsu figure {
		width: 35%;
		top: -6rem;
		left: unset;
		transform: unset;
		margin-bottom:-6rem;
	}
  
	/*onayami*/
	.onayami .name .txt {
		font-size: 5.6rem;
	}
	.onayami .tape-img{
		width: 80%;
		margin: 0 auto 4rem;
	}
	.kieta .contents{
		max-width: 860px;
	}
	.kieta h4 {
		margin-bottom: -1.5rem;
		padding: 1.5rem 2rem;
		font-size: 3.6rem;
	}
	.kieta h4::after {
		width: 40px;
		height: 20px;
		bottom: -18px;
	}
	.kieta ul li {
		padding: 0.5rem 0;
		font-size: 2.4rem;
	}
	
	/*reason*/
	.reason .ttl {
		padding: 7rem 0 3rem;
	}
	.reason h3 .step {
		margin-bottom: 2rem;
		font-size: 2.2rem;
	}
	.reason h3 .step::before {
		font-size: 6.8rem;
		left: 8.5rem;
	}
	.reason h3 .step::after {
		width: 300px;
		left: 17rem;
	}
	.reason figure{
		margin: -3rem 0 4rem 2%;
		width: 58%;
	}
	.reason .box-wrap2 figure{
		margin: -3rem 3% 4rem 0%;
		width: 57%;
		order: 1;
	}
	.reason .box-wrap2 p{
		left: 3rem;
	}
	.reason p{
		padding: 3rem;
		width: calc(40% - 6rem);
		left: -3rem;
	}
	
	/*howto*/
	.howto .contents{
		max-width: 860px;
	}
	.howto .num span {
		padding: 0.25rem 3rem;
		font-size: 2.4rem;
	}
	.howto dl{
		padding: 3rem;
	}
	.howto dt {
		font-size: 3rem;
	}
	.howto .finish::before,
	.howto .finish::after{
		height: 120px;
		top: -119px;
	}
	.howto .finish {
		padding: 8rem 0;
	}
	
	/*support*/
	.support .ttl-box{
		padding: 1rem 0;
		font-size: 2.2rem;
	}
	.support dl {
		width: 49%;
	}
	.support .w-box1{
		padding: 3rem 3rem 1rem;
	}

	/*voice*/
	.voice .ttl{
		padding: 7rem 0 3rem 0;
	}
	.voice .ttl p{
		font-size: 2rem;
	}
	.voice .contents{
		max-width: 860px;
	}
	.voice .box-wrap{
		margin: 0 0 4rem;
	}
	.voice .ttl-box figure img{
		margin: 0 0 -5.5rem -15%;
		width: 160px;
		height: 160px;
	}
	.voice .ttl-box h3{
		font-size: 5rem;
	}
	.voice .txt-box{
		padding: 3rem 4rem;
	}
	.voice .txt-box h4{
		margin: 2rem 0;
		padding-bottom: 2rem;
		font-size: 3rem;
	}
	
	/*media*/
	.media .contents{
		max-width: 860px;
	}
	.media figure{
		padding: 2rem 4rem 4rem;
	}
	.media dt{
		font-size: 2rem;
	}
	.media dd ul{
		margin-top: 2rem;
	}
	
	/*faq*/
	#wrap .faq dt{
		padding-left: 4.4rem;
		font-size: 2.4rem;
	}
	.faq dt::before {
		font-size: 3.6rem;
	}
	.faq dt, .faq dd {
		padding: 2.5rem 0;
	}
	
	/*about*/
	.about .contents{
		max-width: 860px;
	}
	.about h2{
		margin: 0 auto 4rem;
		width: 70%;
	}
	.about .box-wrap{
		padding: 4rem 8rem;
	}
	.about dt{
		font-size: 2.2rem;
		padding: 0.5rem;
	}
	.about ul{
		padding: 4rem;
	}
	.about li:first-child{
		font-size: 2.4rem;
	}	
	
	.btm-bnr p {
		font-size: 3.6rem;
	}
	.btm-bnr p a {
		padding: 2rem 4rem;
	}
	
	footer{
		padding: 6rem 0 16rem;
	}
	footer ul{
		display: flex;
		justify-content: center;
		gap:40px;
	}
	
	#scrollUp {
		bottom: 14rem;
		right: 0;
	}

}