@charset "UTF-8";

/* ---------------------------------------------------------------------------
  ★共通
--------------------------------------------------------------------------- */
:root{
  scroll-padding-top: 136px;
}
html {font-size: 62.5%;scroll-behavior: smooth;}
body{  
  font-size: 1.6rem;
	position: relative
}
object {pointer-events: none;}
.sp {display: none !important;}
a[href^="tel:"] {pointer-events: none;}
a {
    text-decoration: none;
    -webkit-transition: 0.3s;
    transition: 0.3s;
}
.pcFlex{display: flex;}
.pcFlex.half{
 justify-content: space-between;
}
.pcFlex.half >*{
 width: 47.6%;
}
.txtImgBox.pcFlex{justify-content: space-between;}
.txtImgBox .txts{
 width: 50%;
	padding: 50px 0 50px 5%;
}
.txtImgBox.flexRowReverse .txts{
	padding: 50px 5% 50px 0;
}
.txtImgBox> figure,
.txtImgBox> .imgs{
 width: 45%;
	border-radius: 0 30px 30px 0;
}
.txtImgBox.flexRowReverse figure{
	border-radius: 30px 0 0 30px;
}
.txtImgBox .h3Tit{
	font-size: 2.8rem;
	margin-bottom: 30px;
}

.img_r {overflow: hidden;}
.img_r>img {float: right;
    width: 33%;
    margin-left: 15px;
    margin-bottom: 15px;
}
p,li,dt,dd,th,td,input{
  font-size: 1.6rem;
}
h1,h2,h3,h4,h5,h6 {
  font-size: 1.6rem;
}

section{
  padding: 100px 0;
}

/*
　テキスト
========================================== */
.note{
  font-size: 1.2rem;
}

/*
　ボタン,リンク
========================================== */
.btn.inline{
	padding-left: 6%;
 padding-right: 9%;
 font-size: 20px;
}

.btnEntry{
	padding: 50px 0;
}

/*-- table --*/
.basicTable >dt{
	padding: 15px 2.5%;
	width: 23%;
}
.basicTable >dd{
	padding: 15px 2.5%;
	width: 77%;
}
.basicTable >dt:last-of-type{
	border-bottom: none;
}
 .basicTable >dd:last-of-type{
	border-bottom: none;
}

table.basicTable thead th{
	font-size: 1.8rem;
}
.basicTable > dd div + input{
	margin-top:10px 
}

/* =======================================
  ページャー
========================================== */
/*-- pageNavi --*/
.pageNavi{
	gap:0 1.5%;
 margin-top: 80px;
}
.pageNavi .current,
.pageNavi .inactive,
.pageNavi a{
	font-size: 1.8rem;
	width: 40px;
	height: 40px;
}
/*-- pager --*/
.pager{
	margin-top: 50px;
}
.pager a{
font-size: 1.6rem;
  width: 200px;
}

/* =======================================
	header
========================================== */
header{
 height: 91px;
}
header .inner1300{
 height: 91px;
 max-width: 1340px !important;
 align-items: center;
}


/* =======================================
	gnavi
========================================== */

.gnavi{
 align-items: center;
 flex: 1;
 padding-left: 1em;
}

#gnaviList{
 flex: 1;
 justify-content: flex-end;
 align-items: center;
 gap: 0 min(2vw,20px);
}
#gnaviList li{
}
#gnaviList > li{
 position: relative;
}
#gnaviList > li >a{
 display:flex;
 align-items: center;
 height: 48px;
 font-size: min(1.3vw,1.6rem);
 font-weight: 700;
 white-space: nowrap;
}

#gnaviList li.current a,
#gnaviList li a:hover{
 opacity: .7;
}

#gnaviList .hasSub > a{
 position: relative;
}
.gnavi .hasSub:hover .sub{
	display: block;
	visibility: visible;
}
#gnaviList .sub{
	display: none;
	visibility: hidden;
	position: absolute;
 top: calc(100% - 1px);
 left: 50%;
 transform: translate(-50%, 0);
	z-index: 2;
	transition: all 0.6s ease-in-out;
 background: rgba(255,255,255,.8);
 min-width:100px;
}
#gnaviList .hasSub:hover .sub{
	display: block;
	visibility: visible;
}
#gnaviList .sub li{
	font-size: min(1.0vw,1.4rem);
}
#gnaviList .sub li + li{
 border-top: 1px #ccc solid;
}
#gnaviList .sub li a{
	display: block;
 background: var(--yellow);
	padding: 8px 20px 10px;
 color: var(--base);
 font-weight: 600;
 text-align: center;
	white-space: nowrap;
}
#gnaviList .sub li a:hover{
 opacity: .7;
}
#gnaviList .entry{
 position: relative;
 width:min(15vw,190px) ;
}
#gnaviList .entry a{
 position: absolute;
 bottom: -5vw;
 right: 0;
 display: flex;
 align-items: flex-end;
 justify-content: center;
	border-radius: calc(infinity * 1px);
 width: min(15vw,190px) ;
 height: min(15vw,190px) ;
 padding-bottom: 4vw;
 font-size:min(3vw,32px) ;
}


/* =======================================
	footer/#footLinks
========================================== */

#footLinks a:hover{
 opacity: .7;
}

/* =======================================
	footer/#footBottom
========================================== */
#footBottom{
  justify-content: space-between;
}

#footBottom .tel{
}

.footerRight{
  width: 50%;
  display: flex;
  justify-content: end;
  gap: 0 40px;
 line-height: 1.4;
}
.footerNavi >li >a{
 font-size: 16px;
 font-weight: 700;
}

.footerNavi >li + li{
  margin-top: 16px;
}
.footerNavi a{
  color: #000;
}


/* =======================================
	pgs common
========================================== */
/*-- mainTitle --*/
.mainTitle{
 height: 250px;
}
.mainTitle h2{
 font-size: 4rem;
}
.mainTitle h2 span{
	margin-left: 20px;
 margin-bottom: 20px;
}

/*		anchorLink / pageLinks
-----------------------------*/
.anchorLink{
	padding: 50px 0;
	gap:0 1.8%;
	justify-content: center;
}
.anchorLink ul{
	padding: 35px 0;
	gap:15px 20px;
}
.anchorLink a::after,
.anchorLink a:hover::after{
	right: 8%;	
}
.anchorLink a::after{
	border-bottom: 3.5px solid var(--base);
	border-right: 3.5px solid var(--base);
}
.anchorLink a:hover::after{
	border-bottom: 3.5px solid var(--wh);
	border-right: 3.5px solid var(--wh);
}

.pageLinks{
	gap:15px 30px;
	padding: 50px 0;
}
.pageLinks ul{
	gap: 15px 5%;
}
.anchorLink li,
.pageLinks li{
	flex: 1;
	height: 80px;
 font-size: 20px;
}
.anchorLink a,
.pageLinks li a{
	border: 4px solid var(--bk);
	padding: 8px 10px;
}
.pageLinks a::after,
.pageLinks a:hover::after{
	right: 5%;	
}

.pageLinks li a::after{
 border-top: 3.5px solid var(--bk);
  border-right: 3.5px solid var(--bk);
}
.pageLinks a:hover::after{
	border-top: 3.5px solid var(--wh);
  border-right: 3.5px solid var(--wh);
}
.anchorLink + section{
	padding-top: 65px;
}

main .pageLinks:last-child{
	padding-top: 100px;
	padding-bottom: 100px;
}
main .pageLinks:last-child li{
	height: 120px;
 font-size: 2.6rem;
 line-height: 1.5;
}
.pageLinks li a span{
	margin-bottom: 5px;
}
.pageLinks li a span::before,
.pageLinks li a span::after{
	height: 30px;
}

/*-------*/
#leadArea .h3Tit{
	font-size: 3.4rem;
	margin-bottom: 30px;
}
#leadArea .leadTxt{
	font-size: 1.8rem;
	padding: 40px 4%;
}

/* =======================================
	top PC
========================================== */

/*		#mv PC
-----------------------------*/

/*		#topAbout PC
-----------------------------*/
#topAbout ul li:nth-of-type(1){
 width: 28.6%;
}
#topAbout ul li:nth-of-type(2){
 width: 27.9%;
 margin-top: 69px;
 margin-left: -2.28%;
}
#topAbout ul li:nth-of-type(3){
 width: 27.8%;
 margin-top: 20px;
 margin-left: -5.56%;
}
#topAbout ul li:nth-of-type(4){
 width: 28%;
 margin-top:69px;
 margin-left: -4.9%;
}


/*		#topMessage PC
----------------------------------------*/
#topMessage{
 padding-bottom: 0;
}
#topMessage .pcFlex{
 justify-content: space-between;
 align-items: flex-end;
}
#topMessage .txts{
 width: 63.2%;
 max-width: 632px;
 padding-bottom: 70px;
}
#topMessage .txts h2{
 margin-bottom: -1em;
}
#topMessage .txts p{
 padding: 0 0 0 89px;
}
#topMessage figure{
 width: 34.4%;
 max-width: 344px;
}

/*		#topMenu PC
----------------------------------------*/

/*		#topSpecial PC
----------------------------------------*/
#topSpecial{
 padding: 80px 0;
}
#topSpecial ul li{
 width: 34.4%;
 max-width: 341px;
}
#topSpecial ul li + li{
 margin-left: -1.2%;
}
#topSpecial ul li + li +li{
 margin-top: -1%;
 margin-left: -2.2%;
}
#topSpecial a:hover{
 opacity: .7;
}

/* =======================================
   education PC
========================================== */
#educationKinds .txtImgBox:not(:first-of-type){
	margin-top: 40px;
}
#educationKinds .txtImgBox .h3Tit{
	font-size: 2.8rem;
	margin-bottom: 30px;
}
#educationKinds .movieArea{
	margin: 50px 0 100px;
}
#educationKinds .movieArea .h3Tit{
	font-size: 3rem;
	margin-bottom: 20px;
}
#educationKinds .movieArea .movie{
	max-width: 700px;
}

#heroTimeline ul{
	margin: 30px auto 0;
	max-width: 800px;
}
#heroTimeline ul li{
	padding: 20px 30px;
}
#heroTimeline ul li:not(:last-child)::before{
	width: 45px;
	height: 22px;
	bottom: -22px;
	left: calc(50% - 22px);
}
#heroTimeline ul li:not(:last-child)::after{
	width: 30px;
	height: 30px;
	bottom: -16px;
	left: calc(50% - 15px);
}
#heroTimeline ul li + li{
	margin-top: 30px;
}
#heroTimeline ul li h4{
	width: 140px;
	height: 140px;
	font-size: 2.6rem;
}
#heroTimeline ul li p{
	width: calc(97% - 140px);
}
#heroTimeline ul li p span{
	font-size: 2.4rem;
	margin-bottom: 10px;
}


/* =======================================
   business PC
========================================== */
#businessKinds .txtImgBox .h3Tit{
	font-size: 3.8rem;
	margin-bottom: 20px;
	text-align: right;
}
#businessKinds .txtImgBox .h3Tit span{
	font-size: 2.8rem;
	margin-bottom: 10px;
	margin-right: min(-15%,-30px);
	padding: 5px 30px;
}
#businessKinds .txtImgBox .h3Tit span::before{
	left: -40px;
}
#businessKinds .txtImgBox .h3Tit span::after{
	right: -40px;
}
#businessKinds .txtImgBox.flexRowReverse .h3Tit{
	text-align: left;
}
#businessKinds .txtImgBox.flexRowReverse .h3Tit span{
	margin-left:  min(-15%,-30px);
}
#businessKinds .txtImgBox .txts{
	display: grid;
	align-items: center;
	margin-top: 50px;
	padding: 50px;
}
#businessKinds .txtImgBox .txts p{
	font-size: 1.8rem;
}

#businessKinds .otherWork{
  border-radius: 80px;
	margin-top: 50px;
  padding: 50px 100px 60px;
}
#businessKinds .otherWork ul{
	gap: 50px;
}
#businessKinds .otherWork ul li{
	border-radius: 30px;
 width: calc((100% - 50px) / 2);
 overflow: hidden;
}
#businessKinds .otherWork ul li .h4Tit{
	border-radius: 30px 30px 0 0;
 min-height: 3em;
 line-height: 1.5;
 padding: 10px 20px;
}
#businessKinds .otherWork p{
	padding: 20px;
}

#businessKinds .movieArea{
	margin: 50px auto 0;
}
#businessKinds .movieArea .h3Tit{
	font-size: 3rem;
	margin-bottom: 20px;
}
#businessKinds .movieArea .movie{
	max-width: 700px;
}

/* =======================================
   job PC
========================================== */
.jobBox .h3Tit{
	font-size: 3.8rem;
	padding-bottom: 10px;
}
.jobBox .h3Tit .sub{
	margin: -40px auto 10px;
}
.jobBox .txtImgBox .txts{
	padding-left: 0;
	padding-bottom: 0;
}
.jobBox .txtImgBox .txts p{
	font-size: 1.8rem;
}
.jobBox .txtImgBox .txts figure{
	width: min(90%,450px);
}
.jobBox .voice{
	 margin-top: 40px;
}
.jobBox .voice .h4Tit{
	padding: 40px 20px;
	width: 200px;
}
.jobBox .voice .h4Tit::after{
	width: 30px;
	height: 25px;
	bottom: -25px;
	left: 60%;
}
.jobBox .voice p{
	margin: 30px 0 0 -80px;
	padding: 50px 30px 50px 100px;
	width: calc(100% - 130px);
}

/* =======================================
   story PC
========================================== */
#storyMv figure{
 height: 700px;
}
#storyMv h3{
	font-size: 36px;
	line-height: 1.2;
}
#storyMv h3 span{
 font-size: 194%;
}

#storyIntroduction{
	padding-top: 50px;
}
#storyIntroduction ul{
 justify-content: space-between;
}
#storyIntroduction li {
 width: 31%;
}
#storyIntroduction li figure{
 margin: 0 0 20px;
}
#storyIntroduction li h4{
 font-size: 1.85rem;
}

.memberBox .pcFlex{
 justify-content: space-between;
 align-items: flex-end;
}
.memberBox .memberTitle .txts{
	padding-top: 30px;
	width: 65%;
}
.memberBox .memberTitle .h3Tit{
	margin-bottom: 15px;
}
.memberBox .memberTitle p{
	border-top-left-radius: 30px;
	padding: 40px;
}
.memberBox .pcFlex figure{
 width: 35%;
}
.memberBox .memberTitle figure figcaption{
	font-size: 2rem;
	padding: 5px 20px;
}
.memberBox dl{
 margin-top: 40px;
}
.memberBox dt{
font-size: 2rem;
}
.memberBox dd{
	margin: -20px 0 20px 20px;
	padding: 30px;
}
#storyMember01.memberBox .box .h4Tit{
	margin-bottom: 70px;
}
.memberBox .box{
	margin-top: 30px;
}
.memberBox .box ol{
 display: flex;
 justify-content: space-between;
 padding-bottom: 4.6em;
}
.memberBox .box ol::before{
	border-top: 1px dotted var(--bk);
 width: 100%;
 height: 1px;
 top: 21px;
 left: 0;
}
.memberBox .box ol li{
 position: relative;
}
.memberBox .box ol li span{
	width: 125px;
	font-size: 2rem;
}
.memberBox .box ol li:not(:first-child) span::before{
  clip-path: polygon(0 0, 100% 50%, 0 100%);
	top: calc(50% - 5px);
	left: -10px;
}
.memberBox .box ol li p{
 position: absolute;
 top: 100%;
 left: 50%;
 transform: translate(-50%, 0);
 padding-top: 5px;
 min-width: 186px;
 text-align: center;
 line-height: 1.4;
 font-size: 1.5rem;
}

#storyMember01 .box ol{
 justify-content: flex-end;
}
#storyMember01 .box ol li p{
 text-align: left;
}
#storyMember01 .box ol li:nth-of-type(1){
 width: 38%;
 margin-right: auto;
}
#storyMember01 .box ol li:nth-of-type(1) p{
 left: 0; 
 transform: translate(0%, 0);
}
#storyMember01 .box ol li:nth-of-type(2) {
 margin-right: auto;
}
#storyMember01 .box ol li:nth-of-type(2) p{
 bottom: 100%;
 top: auto;
 padding: 0 0 5px;
 white-space: nowrap;
 text-align: center;
}
#storyMember01 .box ol li:nth-of-type(3){
 margin-left: 16%;
 margin-right: 3.5%;
}
#storyMember01 .box ol li:nth-of-type(3) p{
 width: 320px;
	left: 90%;
}

#storyMember02 .box ol li:nth-of-type(3) p{
 width: min(31.5vw,381px);
}

#storyGarelly .cf{
	border-radius: 80px;
	padding: 60px;
}/*
#storyGarelly div.cf figure{
	margin-bottom: 30px;
}
#storyGarelly div.cf figure:nth-of-type(1){
 width: 40%;
 margin-right: 30px;
}
#storyGarelly div.cf figure:nth-of-type(2){
 width: calc(60% - 30px);
}
#storyGarelly div.cf figure:nth-of-type(3){
 width: 34.7%;
 margin-right: 30px;
}
#storyGarelly div.cf figure:nth-of-type(4){
 width: calc(60% - 34.7% - 30px*2);
}
#storyGarelly div.cf figure:nth-of-type(5){
	width: calc(60% - 30px);
	 margin-right: 30px;
}
#storyGarelly div.cf figure:nth-of-type(6){
	width: 40%;
}
#storyGarelly div.cf figure:nth-of-type(7){
	 width: 34.7%;
 margin-right: 30px;
 margin-top: -330px;
}
#storyGarelly div.cf figure:nth-of-type(8){
	width: calc(60% - 34.7% - 30px*2);
	 margin-top: -330px;
}*/

#storyGarelly div.grid{
	display: grid;
  grid-template-columns: 1fr 1fr 1fr 1fr 1fr;
  grid-template-rows: 280px 280px 280px 280px;
	gap:30px
}
#storyGarelly div.grid figure{
	overflow: hidden
}
#storyGarelly div.grid figure img{
	max-width: initial;
	height: 100%
}
#storyGarelly div.grid figure:nth-of-type(1){
	grid-column: 1 / 3;
  grid-row: 1 / 3;
}

#storyGarelly div.grid figure:nth-of-type(2){
	grid-column: 3 / 6;
  grid-row: 1 / 2;
}
#storyGarelly div.grid figure:nth-of-type(3){
	grid-column: 3 / 5;
  grid-row: 2 / 3;
}
#storyGarelly div.grid figure:nth-of-type(4){
	grid-column: 5 / 6;
  grid-row: 2 / 3;
}
#storyGarelly div.grid figure:nth-of-type(5){
	grid-column: 1 / 4;
  grid-row: 3 / 4;
}

#storyGarelly div.grid figure:nth-of-type(6){
	grid-column: 4 / 6;
  grid-row: 3 / 5;
}
#storyGarelly div.grid figure:nth-of-type(7){
	grid-column: 1 / 3;
  grid-row: 4 / 5;
}
#storyGarelly div.grid figure:nth-of-type(8){
	grid-column: 3 / 4;
  grid-row: 4 / 5;
}

/* =======================================
   diagnosis
========================================== */
.analytics-form > dl > dd::after{
	bottom: -20px;
}
.analytics-form > dl > dd:nth-of-type(1)::after{
	width: 90px;
	height: 142px;
	left: 10px;
}
.analytics-form > dl > dd:nth-of-type(2)::after{
	width: 99px;
	height: 144px;
	right: 5px;
}
.analytics-form > dl > dd:nth-of-type(3)::after{
	width: 90px;
	height: 140px;
	left: 8px;
}
.analytics-form > dl > dd:nth-of-type(4)::after{
	width: 100px;
	height: 145px;
	right: 5px;
}
.analytics-form > dl > dd:nth-of-type(5)::after{
	width: 83px;
	height: 142px;
	left: 5px;
}
.analytics-form > dl > dd:nth-of-type(6)::after{
	width: 81px;
	height: 142px;
	right: 5px;
}
.analytics-form > dl > dd:nth-of-type(7)::after{
	width: 98px;
	height: 136px;
	left: 5px;
}


/* =======================================
   diagnosis　result
========================================== */
#diagnosis #leadArea .score dt{
	font-size: 15rem;
}
#diagnosis #leadArea .score dd{
	font-size: min(1.91vw,2.8rem);
}
#diagnosis #leadArea p{
	font-size: min(1.65vw,2.4rem);
	margin-top: 15px;
}

#diagnosis #recommend .txtImgBox{
	align-items: center;
	padding: 30px 3%;
}
#diagnosis #recommend .txtImgBox figure{
	height: 300px;
}
#diagnosis #recommend .txtImgBox .txts{
	padding: 0;
}
#diagnosis #recommend .txtImgBox .txts h4{
	font-size: min(2vw,2.8rem);
	border-bottom: 10px solid var(--yellow);
	margin-bottom: 20px;
	padding-bottom: 15px;
}
#diagnosis #recommend .comment{
	gap: 0 30px;
	margin-top: 40px;
}
#diagnosis #recommend .comment .txts{
	padding: 0 5% 30px;
	width: 75%;
}
#diagnosis #recommend .comment .txts::after{
	width: 35px;
	height: 40px;
	bottom: -40px;
	left: 88%;
}
#diagnosis #recommend .comment .txts h4{
	font-size: 2.2rem;
	margin-left: -20px;
}
#diagnosis #recommend .comment .txts p{
	font-size: 1.8rem;
}
#diagnosis #recommend .comment figure{
	width: 240px;
	height: 240px;
	margin-left: -5%;
}

#diagnosis #entry .btn{
	border: 4px solid var(--bk);
	font-size: 3rem;
	padding: 15px;	
	min-height: 120px;
}
#diagnosis #entry .btn span::before,
#diagnosis #entry .btn span::after{
	height: 30px;
}

#diagnosis .pageLinks ul{
	gap: 15px 5%;
}
#diagnosis .pageLinks ul li{
	width: calc(95% / 2);
	flex: auto;
}
#diagnosis .pageLinks ul li a{
	border-radius: 30px;
	padding: 30px;
}
#diagnosis .pageLinks ul li a span::before{
	left: -10px;
}
#diagnosis .pageLinks ul li a span::after{
	right: -10px;
}
#diagnosis .pageLinks ul li a span::before,
#diagnosis .pageLinks ul li a span::after{
	height: 20px;
}

/* =======================================
   faq PC
========================================== */
#faqArea .leadTxt{
	margin-bottom: 100px;
	text-align: center;
}
#faqArea ul.flexWrap{
	gap: 80px 40px;
}
#faqArea ul.flexWrap > li{
	padding: 0 0 40px;
}
#faqArea ul li h3{
	font-size: min(1.6vw,2.1rem);
	margin: -40px auto 25px;
	padding: 10px;
	width: 90%;
	height: 5em;
}
#faqArea ul.flexWrap li p,
#faqArea ul.flexWrap li ul{
	padding: 0 30px;
}
#faqArea ul li ul li:not(:last-child){
	margin-bottom: 10px;
}

/* =======================================
  road PC
========================================== */
.stepTxts.pcFlex{
 flex-flow: row-reverse wrap;
 justify-content: space-between;
}
.stepTxts.pcFlex figure,
#roadDay li .pcFlex figure{
 width: 43%;
}
.stepTxts.pcFlex .txts,
#roadDay li .pcFlex .txts{
 width: 53%;
}
.stepTxts.pcFlex .btnWrap{
 width: 100%;
}

#roadStep{
	padding-bottom: 60px;
}
#roadStep ol > li{
	 display: flex;
 justify-content: space-between;
	margin-top: 30px;
}
#roadStep ol > li:last-child::after{
	 width: min(20%,200px);
	height: 40px;
 bottom: -40px;
 left: 0;
}
#roadStep ol > li .step{
 width: min(20%,200px);
 padding:0 0 30px 0;
 font-size: 30px;
 font-weight: 900;
}
#roadStep ol > li:first-child .step{
 border-top-left-radius: 30px;
}
#roadDay ol > li > .pcFlex{
 flex-flow: row-reverse wrap;
 justify-content: space-between;
}
#roadStep ol > li + li .step::before,
#roadStep ol > li + li .step::after{
	width:100%;
	height:30px;
}
#roadStep ol > li + li .step::before{
 margin-bottom: -30px;
}
#roadStep ol > li .step > p{
	font-size: 3rem;
	margin-bottom: 30px;
	padding: 50px 10px 40px;
}
#roadStep ol > li:first-child .step > p{
	border-top-left-radius: 30px;
	padding-top: 40px;
}
#roadStep ol > li ul li{
	margin-bottom: 25px;
}
#roadStep ol > li ul li:not(:last-child)::after{
	bottom: -16px;
	left: calc(50% - 3px);
}
.stepTxts{
 width: 80%;
 border-left: none;
 border-radius: 0 30px 30px 0;
 padding: 40px 5%;
}
.stepTxts .btn{
	font-size: 2.6rem;
}
.stepTxts .btn::after{
	right: 5%;
}
.stepTxts .btn span::before,
.stepTxts .btn span::after{
	height: 20px;
}

#roadOffer{
 padding: 0 0 50px;
}

#roadDay ol{
 margin-bottom: 50px;
}
#roadDay ol > li{
margin-top: 20px;
 display: flex;
 justify-content: space-between;
}
#roadDay ol > li .day{
	font-size: 30px;
	width: min(20%,200px);
	padding: 40px 0 30px;
}
#roadDay ol > li:first-child .day{
	border-top-left-radius: 30px;
}
#roadDay ol > li .day span{
	display: block;
}
#roadDay ol > li .day::before,
#roadDay ol > li .day::after{
content: "";
 display: block;
 background: var(--yellow);
clip-path: polygon(0 0, 50% 100%, 100% 0);
 position: absolute;
 margin: auto;
 z-index: 1;
 left: 0;
 right: 0;
	width:100%;
	height:30px;
 top: 100%;
}
#roadDay ol > li .day::before{
 background: #fff;
 margin-top: 20px;
}
#roadDay ol > li > .pcFlex{ 
 width: 80%;
 border-radius: 0 30px 30px 0;
 padding: 40px 5%;
}
#roadDay li .pcFlex h4{
 width: 100%;
}
#roadDay li .pcFlex .btnWrap{
 width: 100%;
}
#roadDay .btn.inline::after{
	right: 6%;
}
.continued{
 font-size: 34px;
 padding: 10px;
}

/* =======================================
	entry PC
========================================== */
#entryBenefits ul{
 gap:30px 40px;
}
#entryBenefits ul li{
 width: calc((100% - 40px*2)/3);
}

/* =======================================
	form PC
========================================== */
.confirm {
		margin-top: 40px;
}


/* =======================================
	thanks
========================================== */

#thanks{
}

#thanks p{
  font-size: 1.8rem;
}

/* =======================================
	privacypolicy
========================================== */
#privacyPolicy{
	margin-top: 50px;
}
.policyBox{
	padding: 20px 2%;
}
.policyBox .h5Tit{
	margin-top: 40px;
}