/* --------------------------------------
アニメーション animation
------------------------------------------- */
.header_img_sub_title,.header_img_main_title {overflow-x: hidden;transform-origin: top center;animation: loading 2s;}
#header_box{animation-name:fadeInAnime;animation-duration:1s;animation-fill-mode:forwards;opacity:0;}

@keyframes fadeInAnime{
from {opacity: 0;}
to {opacity: 1;}
}

@keyframes loading {
0% {opacity: 0;transform: scale(1.05);}
100% {opacity: 1;transform: scale(1);}
}


.fadein {opacity : 0;transform : translate(0, 50px);transition : all 1s;}
.fadein.active{opacity : 1;transform : translate(0, 0);}
.fadein_r {opacity : 0;transform : translate(-90px, 0);transition : all 2s;}
.fadein_r.active{opacity : 1;transform : translate(0, 0);}
.fadein_l {opacity : 0;transform : translate(60px, 0);transition : all 1s;}
.fadein_l.active{opacity : 1;transform : translate(0, 0);}

/* --------------------------------------
共通部分 common
------------------------------------------- */
body{max-width:680px;}
h2.heading_h2{transform: rotate(0.05deg);font-size: min(5.5vw, 21px);font-family: "irohakakuc", 'Noto Serif JP', serif, sans-serif;font-weight: 500;font-style: normal;color:#432570;text-align: center;margin: 2em 0 1em;}

/* --------------------------------------
ヘッダー部分 header
------------------------------------------- */
#header_{position:relative;}
#header_ h1{    transform: rotate(0.05deg);font-family: "irohakakuc", 'Noto Serif JP', serif, sans-serif;position: absolute;top: 0.25em;left: 50%;transform: translateX(-50%);width: 100%;color: #fff;font-size: min(4.5vw, 18px);text-align: center;}
.header_txt{transform: rotate(0.05deg);font-size: 20px;font-family: "irohakakuc", 'Noto Serif JP', serif, sans-serif;font-weight: 500;font-style: normal;text-align: center;color: #432570;font-size: min(5.5vw, 21px); margin: 1em 1em 1.5em;;}
.header_img_sub_title{width: 100%;margin: 1em auto;box-sizing: border-box;padding: 0 14%;}
.header_img_main_title{width: 100%;margin: 0 auto;padding: 0 20%;box-sizing: border-box;}
.header_catch{transform: rotate(0.05deg);font-size: 20px;font-family: "irohakakuc", 'Noto Serif JP', serif, sans-serif;font-weight: 500;font-style: normal;text-align: center;color: #432570;margin: 1.5em 0;line-height: 1.6;font-size: min(5.5vw, 21px);}

/* --------------------------------------
リードアリア area_lead
------------------------------------------- */
.area_lead_image {padding: 0 6%;}
.wrap_area_lead_img{width:100%;padding: 0 8%;box-sizing: border-box;}
.wrap_area_lead_img p{width:100%;margin:0 auto;}
.wrap_area_lead_txt{width:100%;box-sizing: border-box;margin-top: 2em;}
.wrap_area_lead_txt ._txt{font-family: 'Noto Serif JP', serif;font-size: min(4.6vw, 16px);margin: 1em 0;color:#494646;font-weight: 600;line-height: 1.7;}

/* --------------------------------------
商品紹介 product
------------------------------------------- */
.wrap_p_product{margin-top: 8%;padding: 0 8%;}
.wrap_p_product .p_product{width:100%;color:#494646;margin-bottom: 12%;}
.wrap_p_product .p_product_name{font-size: min(4.6vw, 16px);margin: 1em 0 0.25em;text-align: center;font-weight: bold;}
.wrap_p_product .p_product_price{margin: 0.25em 1em 0.5em 3em;font-size: 15px;}
.wrap_p_product .p_product_button{background: #432570;width: 100%;margin: 0 auto;padding: 10px 0 8px;text-align: center;border-radius: 24px;color: #fff;border:1px solid #432570;transition:0.2s;font-size:16px;}
.wrap_p_product img{width:100%;}

/* --------------------------------------
仕切り線 Hr
------------------------------------------- */
#Hr .hr_img{margin: 16% 0;padding: 0 6%;text-align: center;}

/* --------------------------------------
ジャックオランタン jack-o-
------------------------------------------- */
#Pumpkin .wrap_area_lead_img p{width:100%;}
#Pumpkin .wrap_area_lead_img img{width:100%;}
.wrap_contents_pumpkin{margin: 8% 0;}
.wrap_contents_pumpkin .wrap_area_lead_txt{text-align: center;}
.wrap_contents_pumpkin .area_lead_image{align-items: flex-start;}
#Pumpkin .wrap_contents_pumpkin .wrap_area_lead_img p{width:100%;}
.wrap_contents_pumpkin .lead_pumpkin_icon{width:100%;margin: 0 auto;padding: 0 8%;box-sizing: border-box;}
.wrap_contents_pumpkin ._txt{text-align: left;}
#Pumpkin .wrap_contents_pumpkin .area_lead_image._bottom .lead_pumpkin_icon{    width: 40%;margin: 2em auto 0;position: absolute;bottom: -8%;right: -4%;}
.wrap_contents_pumpkin .area_lead_image._bottom{align-items: flex-end;flex-direction: row-reverse;}
.wrap_contents_pumpkin .pumpkin_name{font-size: min(4.6vw, 16px);font-weight: bold;}
.wrap_contents_pumpkin .pumpkin_price{margin: 0.5em;font-size: 15px;}
.wrap_contents_pumpkin .pumpkin_button{background: #432570;width: 100%;margin: 0 auto;padding: 10px 0 8px;text-align: center;border-radius: 24px;color: #fff;border:1px solid #432570;transition:0.2s;font-size:16px;}
.wrap_contents_pumpkin .wrap_pumpkin_submit{margin: 1em 0 2em;}
.area_lead_image._bottom{margin-top:8%;}
.area_lead_image._bottom .wrap_area_lead_img{position:relative;}

/* --------------------------------------
ジャックオランタン作り方 How to make
------------------------------------------- */
.wrap_howto{margin-bottom:2em;}
.wrap_howto .howto_list{display:flex;flex-wrap: wrap;padding: 0 4%;}
.wrap_howto .howto_list li{width: 46%;margin: 2%;}
.wrap_howto .howto_list li:last-of-type{width: 100%;margin: 2% 0;}
.wrap_howto .howto_list li:last-of-type dl{display:flex;flex-wrap:wrap;align-items: center;}
.wrap_howto .howto_list li:last-of-type dl dt{width:100%;}
.wrap_howto .howto_list li:last-of-type dl dd{width: 48%;margin: 1%;}
.wrap_howto .howto_list li dl dt{transform: rotate(0.05deg);font-size: 16px;font-family: "irohakakuc", 'Noto Serif JP', serif, sans-serif;color: #432570;margin-bottom: 0.5em;font-weight: bold;}
.wrap_howto .howto_list li:last-of-type dl dt{text-align: center;font-size: 21px;}
.wrap_howto .howto_list li dl dt .howto_icon{display:inline-block;width:34px;}
.wrap_howto .howto_list li:last-of-type dl dt .howto_icon{width:40px;}
.wrap_howto .howto_list li dl dd.howto_txt{font-size: min(4vw, 15px);padding:0.5em 0;line-height: 1.6;}
.wrap_howto_submit_both{padding: 0 6%;}
.wrap_howto_submit_left{width: 100%;box-sizing: border-box;}
.wrap_howto_submit_left img{width: 100%}
.wrap_howto_submit_right{width:100%;}
.wrap_howto_submit_right .howto_name{font-size: min(4.6vw, 16px);font-weight: bold;text-align: center;}
.wrap_howto_submit_right .howto_price{margin: 0.5em;font-size: 15px;text-align: center;}
.wrap_howto_submit_right .howto_button{background: #432570;width: 100%;margin: 0 auto;padding: 10px 0 8px;text-align: center;border-radius: 24px;color: #fff;border:1px solid #432570;transition:0.2s;font-size:16px;}
.wrap_howto_submit_right .howto_submit{margin-bottom:2em;}
.wrap_howto_submit_right .howto_txt {font-family: 'Noto Serif JP', serif;font-size: min(4.6vw, 16px);margin: 1em 0;color: #494646;font-weight: 600;line-height: 1.6;}
.wrap_howto .howto_img{text-align: center;}
.wrap_howto .howto_img img{width:100%;}

/* --------------------------------------
SNS SNS
------------------------------------------- */
.wrap_sns{padding: 1em 6%;background: #494646;position:relative;margin: 16% 0;}
.wrap_sns::before{content: '';background: url(//img.e87.com/selection/autumn/2024images/icon_sns_01.png);background-size: 100%;width: 79px;height: 27px;position: absolute;left: 1em;top: 1em;}
.wrap_sns::after{content: '';background: url(//img.e87.com/selection/autumn/2024images/icon_sns_02.png);background-size: 100%;width: 58px;height: 84px;position: absolute;right: 0.5em;top: 0.5em;z-index: 0;}
.wrap_sns h2.heading_h2{color:#fff;margin:1em 0;position: relative;z-index: 1;}
#Column .wrap_area_lead_img p{width:100%;}
.wrap_sns .sns_txt{font-size: min(4.6vw, 16px);line-height: 1.8;color:#fff;margin-bottom: 1em;position: relative;z-index: 1;}
.wrap_sns .sns_list{display:flex;flex-wrap:wrap;justify-content: center;}
.wrap_sns .sns_list li{width: 40%;margin:2%;text-align: center;}
.wrap_sns .sns_list li img{width: 100%;}
.column_main_txt{background: #494646;padding: 1em;margin: 1em 0 0;}
.column_main_txt .wrap_main_txt{background: #f1eef6;padding: 4%;}
.column_main_txt .wrap_main_txt .main_txt{color:#494646;font-size: min(4.6vw, 16px);font-family: 'Noto Serif JP', serif;line-height: 1.8;margin-bottom: 1em;font-weight: 600;}
.column_main_txt .wrap_main_txt .main_txt:last-of-type{margin-bottom:0;}

/* --------------------------------------
???????? scroll top
------------------------------------------- */
#to-top {position: fixed;bottom: 12%;right: 4%;width: 55px;text-decoration: none;display: block;text-align: center;opacity: 0;transition: 0.2s;color: #fff;line-height: 48px;font-size: 16px;z-index: 10;transition: 0.2s;}
#to-top.fade {opacity: 1;transition: 0.2s;}
.wrap-top {color: #fff;position: relative;text-align: center;font-weight: bold;padding-top: 8px;height: 60px;z-index: 0;border-radius: 50%;width: 60px;box-sizing: border-box;font-size: 16px;}
.wrap-top::before {content: '';width: 10px;height: 10px;display: block;border-top: solid 2px #fff;border-right: solid 2px #fff;transform: rotate(-45deg) translate(-50%, -50%);position: absolute;top: 18%;left: 54%;margin: auto}
.wrap-top::after {content: '';background: url(https://img.e87.com/selection/autumn/2024images/top_halloween.png) no-repeat;position: absolute;width: 56px;height: 59px;left: 50%;top: 50%;transform: translate(-50%, -50%);background-size: contain;z-index: -1;}