/*--------------------------------------------------------------------------
汎用
--------------------------------------------------------------------------*/
body {
	max-width: 640px;
	min-width: 320px;
	min-height: 100%;
	overflow: hidden;
	scrollbar-face-color: #ff931e;
	scrollbar-track-color: #fff;
	scrollbar-arrow-color: #ff931e;
	scrollbar-shadow-color: #fff;
}

main {display: block;}

/*sp限定*/
.pc {display: none!important;}

/*コンティナ*/
.container {display: block; padding: 0 16px;}

.arrow {position: relative; font-size: 18px; padding: 10px 15px; border: 5px solid #1f3134; background: #fff;}
.arrow:before {content: ""; display: block; position: absolute; bottom: -26px; left: 50%; transform: translate(-50%,0); width: 0; height: 0; border-style: solid; border-width: 26px 40px 0 40px; border-color: #1f3134 transparent transparent transparent; z-index: 1;}
.arrow:after {content: ""; display: block; position: absolute; bottom: -20px; left: 50%; transform: translate(-50%,0); width: 0; height: 0; border-style: solid; border-width: 26px 40px 0 40px; border-color: #fff transparent transparent transparent; z-index: 2;}

.link {position: relative; top:0; left:0; display: inline-block; padding: 25px 20px 20px; background: #fff; border: 5px solid #ff1d25; border-radius: 10px; line-height: 1.25; box-sizing:border-box; box-shadow: 0px 5px 0 0 #ff1d25; opacity: 1; z-index: 1;}
.link:hover {opacity: 1;}
.link:active {box-shadow: 0 0 #ff1d25; transform: translate3d(0, 4px, 0); transform-origin: top;}

.card a {padding: 0 0 40px;}
.card li p {text-align: center; margin-top: 10px;}

header {background: #ff931e; padding: 20px 10px;}
header a img {margin: 0 auto;}

/*--------------------------------------------------------------------------
TOPページ
--------------------------------------------------------------------------*/
#front h1 {width: 100vw; height: 60vw; background: #ff931e; overflow: hidden;}
#front h1 img {width: 100%; margin: 0 auto;}

#front .sec01 {background: #ffff1e; padding: 40px 0;}
#front .sec01 .arrow {display: block; margin-bottom: 40px; padding: 0;}
#front .sec01 .arrow .step {position: absolute; top: -29px; left: -18px; width: 102px; height: 102px;}
#front .sec01 .arrow .text h3 {font-size: 28px; line-height: 1.25; padding: 15px 0 0 88px;}
#front .sec01 .arrow .text p {font-size: 18px; line-height: 1.25; padding: 10px 10px 0 10px; letter-spacing: -1px;}
#front .sec01 .arrow:nth-child(2) .text h3,
#front .sec01 .arrow:nth-child(4) .text h3 {padding-top: 25px;}
#front .sec01 .arrow:nth-child(2) .text p,
#front .sec01 .arrow:nth-child(4) .text p {padding-top: 25px;}
#front .sec01 .arrow .img {margin: 20px auto; text-align: center;}
#front .sec01 .arrow .img img {width: 70%; margin: 0 auto;}
#front .sec01 .arrow:nth-child(4) .img img {width: 50%;}
#front .sec01 .arrow:nth-child(5) .img img {width: 50%;}
#front .sec01 .arrow .img small {display: block; font-size: 14px; font-weight: 700; margin-top: 10px;}

#front .sec02 {padding-bottom: 50px;}
#front .sec02 h2 {margin: -25px 0 25px;}
#front .sec02 ul {display: block;}
#front .sec02 ul li {width: 100%; padding: 20px 0; border-bottom: 2px solid #592f02; box-sizing: border-box;}
#front .sec02 ul li:first-child {border-top: 2px solid #592f02;}
#front .sec02 ul li img {margin: 0 auto 20px;}
#front .sec02 ul li h3 {font-size: 24px; color: #592f02; line-height: 1.25; letter-spacing: -1px; text-align: center;}
#front .sec02 ul li p {font-size: 16px; letter-spacing: -0.5px; margin-top: 12px;}

#front .sec03 {background: #faf8e3; padding-bottom: 20px;}
#front .sec03 h2 {font-family: 'M PLUS Rounded 1c', sans-serif; font-size: 32px; color: #8c6239; text-align: center; padding: 50px 0;}
#front .sec03 h2 span {display: block; font-size: 13px; text-align: center; font-weight: 700;}
#front .sec03 .card {justify-content: space-around;}
#front .sec03 .card li {position: relative; width: 291px; height: 176px; margin: 0 0 20px; z-index: 1; transition: .3s ease; z-index: 1;}
#front .sec03 .card li:before {content: ""; display: block; position: absolute; top: 20px; right: 0; width: 21px; height: 136px; border-radius:50%; box-shadow:5px 5px 10px 5px rgba(0,0,0,0.2); z-index: -1;}
#front .sec03 .card li:after {content: ""; display: block; position: absolute; bottom: 0; left: 0; width: 251px; height: 21px; border-radius:50%; box-shadow:5px 5px 10px 5px rgba(0,0,0,0.2); z-index: -1;}

#front .sec04 {padding: 50px 16px; text-align: center;}
#front .sec04 span {display: block; font-size: 15px; font-weight: 700; margin-top: 15px;}

#notice {background: #faf8e3; padding: 40px 0 10px;}
#notice h3 {position: relative; display: inline-block; font-size: 1.5rem; color: #fff; background: #000; padding: 5px 10px 5px 15px; z-index: 1;}
#notice h3:after {content: ""; position: absolute; right: -20px; bottom: 0; display: block; width: 0; height: 0; border-style: solid; border-width: 46px 0 0px 20px; border-color: transparent transparent transparent #000000; z-index: 1;}
#notice em {color: #f3981d; font-weight: 700;}
#notice ul {display: block; margin-bottom: 50px; padding: 10px 1rem 10px 2.5rem; border: #000 1px solid; background: #fff; box-shadow: 10px 10px 0 0 rgba(128,128,128, .2); }
#notice ul li {font-size: .95rem; margin: 15px 0; line-height: 1.75; list-style: decimal;}
#notice .link_bnr {display: block; margin: 40px 16px;}

/*------------------------------------
フッター
------------------------------------*/
footer nav ul li {padding: 0 10px;}
footer nav ul li a {font-size: 12px;}

/*スクロール*/
#scroll {bottom: 20px; right: 20px; width: 56px; height: 56px;}

/*--------------------------------------------------------------------------
フォーム (page-form.php)
--------------------------------------------------------------------------*/
#form {font-size: .95rem;}
#form fieldset {margin-bottom: 20px;}
#form fieldset input[type="text"],
#form fieldset input[type="email"],
#form fieldset input[type="tel"],
#form fieldset textarea {width: calc(100% - 24px); font-size: .9rem; padding: 8px 12px;}
#form fieldset legend {font-size: 1.2rem;}
#form fieldset legend span {font-size: .9rem; padding: 2px 8px;}
#form fieldset label.file {display: inline-block; color: #fff; font-size: 1.1rem; font-weight: 700; margin: 5px 0; padding: 8px 40px; background: #000; border: 1px solid #000; transition: .3s cubic-bezier(.09,1.17,.51,.98);}
#form fieldset label.file:hover {color: #000; background: #fff; cursor: pointer;}
#form fieldset label.file input[type="file"] {display: none;}
#form fieldset input.file-name {display: block!important; width:100%; margin-left: 0;}
#form fieldset p {font-size: .95rem; margin-bottom: 15px;}
#form fieldset.adr h3 {font-size: 1.1rem;}
#form fieldset span.notice {font-size: .9rem;}
#form .cheak {text-align: center; margin-bottom: 20px;}
#form .cheak label {position: relative; display: inline-block; text-align: center; cursor: pointer;}
#form .cheak span {display: block; margin: 5px 0 0;}

#form .contact {margin: 40px auto;}
#form .contact h2 {font-size: 1.75rem; border-bottom: 1px solid #999; margin-bottom: 40px; padding-bottom: 30px;}
#form .contact input[type="submit"] {margin: 40px auto;}

/*--------------------------------------------------------------------------
テンプレート選択 (page-selest.php)
--------------------------------------------------------------------------*/
#select .arrow {margin: 0 auto 40px;}

#select .select_card {padding: 40px 0 20px; background: #ffff1e;}
#select .select_card .your-card {width: 100%;}
#select .select_card .your-card #card_radio {display: flex; justify-content: space-around; align-items: center; flex-wrap: wrap;}
#select .select_card .your-card .wpcf7-list-item {position: relative; display: block; width: 90vw; margin: 0 0 20px; text-align: center; transition: .3s cubic-bezier(.09,1.17,.51,.98);}
#select .select_card .your-card .wpcf7-list-item:hover {opacity: .8;}
#select .select_card .your-card .wpcf7-list-item label {cursor: pointer;}
#select .select_card .your-card .wpcf7-list-item label:before {width: 90vw; height: 54.5vw;}
#select .select_card .your-card .wpcf7-list-item span.wpcf7-list-item-label {font-size: 1.05rem; margin-top: 10px;}

#select .data_input {padding: 40px 0 0;}
#select .data_input .caution {border: 1px solid #ff1d25; padding: 15px;}
#select .data_input .caution h3 {font-size: 1.5rem; color: #ff1d25; text-align: center; margin-bottom: 8px;}
#select .data_input .caution p {font-size: 1.05rem; color: #ff1d25;}
#select .data_input .caution strong {font-weight: 700; font-size: 1.1rem; color: inherit;}

#select .submit_button {text-align: center; padding: 30px 12px; background: #ffff1e;}
#select .submit_button input[type="submit"] {font-size: 1.3rem; font-weight: 700; color: #ff1d25; padding: 25px 20px 20px; border: 5px solid #ff1d25; transition: all 0.3s ease-in-out;}

.wpcf7-response-output {width: auto; margin: 30px 15px!important;}

/*--------------------------------------------------------------------------
ページ内スクロール
--------------------------------------------------------------------------*/
#scroll {bottom: 20px; left: 20px;}