@charset "UTF-8";
/* CSS Document */

/*--------------------------------------------------------
　基本設定
--------------------------------------------------------*/

#main_omiya {
	position: relative;
	z-index: 20;
}

#main_753 {
	position: relative;
	z-index: 20;
}

#first {
	background: #f6f4f2;
}

/*--------------------------------------------------------
　PC
--------------------------------------------------------*/

@media print, screen and (min-width: 751px){
	
	#first {
        padding: 118px 0 0;
		position: relative;
		z-index: 10;
    }
	
	#first div.text{
        width: 90%;
		max-width: 940px;
		margin: 0 auto;
    }
	
	#first div.text p{
        font-size: 17px;
		font-size: 1.7rem;
		font-family: ten-mincho-text, 'Noto Serif JP', serif;
		line-height: 2.2;
		text-align: center;
		margin-bottom: 50px;
    }
	
	#first div.box{
		width: 90%;
		max-width: 920px;
		height: 33vw;
        max-height: 360px;
		margin: 0 auto;
		position: relative;
    }
	
	#first div.box p.bubble {
		position: absolute;
		z-index: 3;
		line-height: 0;
		margin-bottom: 0;
	}
	
	#first div.box p.bubble01 {
		width: 29%;
		top: 13.8%;
		left: 0;
	}
	
	#first div.box p.bubble02 {
		width: 27.8%;
		top: 0;
		left: 35%;
	}
	
	#first div.box p.bubble03 {
		width: 23.4%;
		top: -1%;
		right: 0;
	}
	
	#first div.box p.bubble04 {
		width: 27.4%;
		bottom: -6.3%;
		left: 17.8%;
	}
	
	#first div.box p.bubble05 {
		width: 29.6%;
		bottom: -10%;
		right: 14.3%;
	}
	
	#introduction {
		padding: 90px 0 0;
	}
	
	#introduction p.center{
		font-size: 15px;
		font-size: 1.5rem;
		line-height: 2.1;
		text-align: center;
	}
	
	#introduction p.center:first-child{
		margin-bottom: 80px;
	}
	
	#introduction h3 + p.center{
		margin-bottom: 170px;
		position: relative;
		z-index: 10;
	}
	
	#introduction div.box{
		width: 90%;
		max-width: 1090px;
		margin: 0 auto;
		position: relative;
	}
	
	#introduction div.box_inner {
		width: 98.7%;
		margin: 0 auto;
		display: flex;
		flex-wrap: wrap;
		justify-content: space-between;
		align-items: flex-end;
	}
	
	#introduction div.box_inner + div.box_inner {
		margin-top: 125px;
	}
	
	#introduction div.box_inner.re {
		flex-direction: row-reverse;
	}
	
	#introduction div.box_inner div.text_box {
		width: 56.6%;
		position: relative;
		z-index: 5;
	}
	
	#introduction div.box_inner div.text_box.deco::before {
		content: "";
		width: 39%;
		height: 100%;
		display: block;
		background: url("../images/753/deco01.png") no-repeat;
		background-size: contain;
		position: absolute;
		top: -59%;
		right: 0;
		z-index: -1;
	}
	
	#introduction div.box_inner.re div.text_box {
		padding-left: 6%;
	}
	
	#introduction div.box_inner div.text_box h4{
		font-size: 24px;
		font-size: 2.4rem;
		font-family: 'Noto Serif JP', serif;
		line-height: 1.3;
		margin-bottom: 1em;
	}
	
	#introduction div.box_inner div.text_box h5{
		font-size: 18px;
		font-size: 1.8rem;
		font-weight: 500;
		line-height: 1.6;
	}
	
	#introduction div.box_inner div.text_box h5 span.reco{
		color: #85C5B9;
        font-size: 14px;
        font-size: 1.4rem;
        font-family: 'Noto Serif JP', serif;
        font-weight: 700;
        line-height: 1.3;
        display: inline-block;
		padding: 0 0.75em;
        text-align: center;
        letter-spacing: 0.08em;
        position: relative;
	}
	
	#introduction div.box_inner div.text_box h5 span.reco::before {
        content: "";
        width: 1px;
        height: 16px;
        border-left: 1px solid #85C5B9;
        position: absolute;
        left: 0;
        bottom: 2px;
        transform: rotate(-20deg);
    }
	
	#introduction div.box_inner div.text_box h5 span.reco::after {
        content: "";
        width: 1px;
        height: 16px;
        border-right: 1px solid #85C5B9;
        position: absolute;
        right: 0;
        bottom: 1px;
        transform: rotate(20deg);
    }
	
	#introduction div.box_inner div.text_box ul {
		list-style: none;
		font-size: 14px;
        font-size: 1.4rem;
		margin-top: 0.75em;
    }
	
	#introduction div.box_inner div.text_box ul li{
		line-height: 1.3;
		text-indent: -1.35em;
		padding-left: 1.35em;
    }
	
	#introduction div.box_inner div.text_box ul li + li{
		margin-top: 5px;
    }
	
	#introduction div.box_inner div.text_box p {
		font-size: 14px;
        font-size: 1.4rem;
		margin-top: 0.75em;
    }
	
	#introduction div.box_inner div.text_box p a{
		color: #595757;
		text-decoration: underline;
    }
	
	#introduction div.box_inner div.photo_box {
		width: 44%;
		line-height: 0;
		position: relative;
		z-index: 3;
		margin-right: -3.2%;
	}
	
	#introduction div.box_inner.re div.photo_box {
		margin-right: initial;
		margin-left: -3.2%;
	}
	
	#introduction div.box_inner:nth-child(even) div.photo_box::after{
		content: "";
		width: 153%;
		height: 100%;
		display: block;
		background: #f6f4f2;
		position: absolute;
		bottom: -26%;
		left: -7%;
		z-index: -1;
	}
	
	#introduction div.box_inner:nth-child(odd) div.photo_box::after{
		content: "";
		width: 153%;
		height: 100%;
		display: block;
		background: #f6f4f2;
		position: absolute;
		bottom: -26%;
		right: -7%;
		z-index: -1;
	}
	
	#introduction div.box_inner:first-of-type div.photo_box::after{
		bottom: initial;
		top: -30%;
	}
	
	#introduction div.box_inner div.photo_box.photo01::before{
		content: "";
		width: 58.6%;
		height: 66.3%;
		display: block;
		background: url("../images/753/deco02.png") no-repeat;
		background-size: contain;
		position: absolute;
		bottom: -59%;
		right: 8.5%;
		z-index: 5;
	}
	
	#introduction div.box_inner div.photo_box span{
		display: block;
		overflow: hidden;
		border-radius: 17px;
	}
	
	#faq {
		margin-top: 200px!important;
	}
	
	section#faq::before {
        content: "";
        width: 16.9vw;
        max-width: 185px;
        height: 18.3vw;
        max-height: 200px;
        display: block;
        background: url(../images/753/deco02.png) no-repeat;
        background-size: contain;
        position: absolute;
        right: 10%;
        top: -75px;
        z-index: -1;
    }
	
}

@media screen and (min-width: 751px) and (max-width: 968px){
	#introduction div.box_inner div.text_box.deco::before {
        content: "";
        width: 39%;
        height: 100%;
        display: block;
        background: url(../images/753/deco01.png) no-repeat;
        background-size: contain;
        position: absolute;
        top: -38%;
        right: -20%;
        z-index: -1;
    }
}

/*--------------------------------------------------------
　SP
--------------------------------------------------------*/

@media screen and (max-width: 750px){
	
	#first {
        padding: 15vw 0 10vw;
    }
	
	#first div.text{
        width: 90%;
		margin: 0 auto;
    }
	
	#first div.text p{
        font-size: 16px;
		font-size: 1.6rem;
		font-family: ten-mincho-text, 'Noto Serif JP', serif;
		line-height: 2.2;
		text-align: center;
		margin-bottom: 10vw;
    }
	
	#first div.box{
		width: 90%;
		margin: 0 auto;
		position: relative;
    }
	
	#first div.box p.bubble {
		z-index: 3;
		line-height: 0;
		margin-bottom: 0;
	}
	
	#first div.box p.bubble + p.bubble{
		margin-top: 4vw;
	}
	
	#first div.box p.bubble01 {
		width: 80%;
	}
	
	#first div.box p.bubble02 {
		width: 74.4%;
		margin-left: 20%;
	}
	
	#first div.box p.bubble03 {
		width: 63.2%;
	}
	
	#first div.box p.bubble04 {
		width: 73%;
		margin-left: 20%;
	}
	
	#first div.box p.bubble05 {
		width: 80%;
	}
	
	#introduction {
		padding: 15vw 0 0;
	}
	
	#introduction p.center{
		font-size: 14px;
		font-size: 1.4rem;
		line-height: 2.1;
		text-align: left;
	}
	
	#introduction p.center:first-child{
		margin-bottom: 80px;
	}
	
	#introduction h3 + p.center{
		margin-bottom: 15vw;
		position: relative;
		z-index: 10;
	}
	
	#introduction div.box{
		width: 90%;
		margin: 0 auto;
		position: relative;
	}
	
	#introduction div.box_inner {
		width: 98%;
		margin: 0 auto;
	}
	
	#introduction div.box_inner + div.box_inner {
		margin-top: 15vw;
	}
	
	#introduction div.box_inner.re {
		flex-direction: row-reverse;
	}
	
	#introduction div.box_inner div.text_box {
		width: 100%;
		position: relative;
		z-index: 5;
	}
	
	#introduction div.box_inner.re div.text_box {
		padding-left: 6%;
	}
	
	#introduction div.box_inner div.text_box h4{
		font-size: 22px;
		font-size: 2.2rem;
		font-family: 'Noto Serif JP', serif;
		line-height: 1.3;
		margin-bottom: 1em;
	}
	
	#introduction div.box_inner div.text_box h5{
		font-size: 16px;
		font-size: 1.6rem;
		font-weight: 500;
		line-height: 1.6;
	}
	
	#introduction div.box_inner div.text_box h5 span.reco{
		color: #85C5B9;
        font-size: 14px;
        font-size: 1.4rem;
        font-family: 'Noto Serif JP', serif;
        font-weight: 700;
        line-height: 1.3;
        display: inline-block;
		padding: 0 0.75em;
        text-align: center;
        letter-spacing: 0.08em;
        position: relative;
	}
	
	#introduction div.box_inner div.text_box h5 span.reco::before {
        content: "";
        width: 1px;
        height: 16px;
        border-left: 1px solid #85C5B9;
        position: absolute;
        left: 0;
        bottom: 2px;
        transform: rotate(-20deg);
    }
	
	#introduction div.box_inner div.text_box h5 span.reco::after {
        content: "";
        width: 1px;
        height: 16px;
        border-right: 1px solid #85C5B9;
        position: absolute;
        right: 0;
        bottom: 1px;
        transform: rotate(20deg);
    }
	
	#introduction div.box_inner div.text_box ul {
		list-style: none;
		font-size: 14px;
        font-size: 1.4rem;
		margin-top: 0.75em;
    }
	
	#introduction div.box_inner div.text_box ul li{
		line-height: 1.3;
		text-indent: -1.35em;
		padding-left: 1.35em;
    }
	
	#introduction div.box_inner div.text_box ul li + li{
		margin-top: 5px;
    }
	
	#introduction div.box_inner div.text_box p {
		font-size: 14px;
        font-size: 1.4rem;
		margin-top: 0.75em;
    }
	
	#introduction div.box_inner div.text_box p a{
		color: #595757;
		text-decoration: underline;
    }
	
	#introduction div.box_inner div.photo_box {
		width: 100%;
		line-height: 0;
		position: relative;
		z-index: 3;
		margin-top: 8vw;
	}
	
	#introduction div.box_inner:nth-child(even) div.photo_box::after{
		content: "";
		width: 90%;
		height: 90%;
		display: block;
		background: #f6f4f2;
		position: absolute;
		top: -30%;
		left: -7%;
		z-index: -1;
	}
	
	#introduction div.box_inner:nth-child(odd) div.photo_box::after{
		content: "";
		width: 90%;
		height: 90%;
		display: block;
		background: #f6f4f2;
		position: absolute;
		top: -30%;
		right: -7%;
		z-index: -1;
	}
	
	#introduction div.box_inner div.photo_box.photo01::before{
		content: "";
		width: 58.6%;
		height: 66.3%;
		display: block;
		background: url("../images/753/deco02.png") no-repeat;
		background-size: contain;
		position: absolute;
		bottom: -59%;
		right: -15%;
		z-index: 5;
	}
	
	#introduction div.box_inner div.photo_box span{
		display: block;
		overflow: hidden;
		border-radius: 3.4vw;
	}
	
}