@charset "utf-8";

#atl_wrap{
    width: 100%;
	text-align: center;
    margin: 0 auto;
	color: #3c3c3c;
    display: block;
	line-height: 1.4;
    position: relative;
    font-family: "Yu Gothic Medium", "Yu Gothic", "游ゴシック", "游ゴシック体", "Helvetica Neue", HelveticaNeue, YuGothic, Verdana, Meiryo, sans-serif;
    font-weight: 500;
    font-feature-settings: "palt";
    letter-spacing: 0.05em;
}

#atl_wrap hr{
    border: none;
    border-top: 1px solid #e2e2e2;
}

#atl_wrap .inner{
    max-width: 1000px;
    margin: 0 auto;
}

*:focus {
outline: none;
}
#atl_wrap ul{
    margin: 0;
    padding: 0;
}
#atl_wrap li{
    list-style: none;
}
#atl_wrap a {
    text-decoration: none;
}
#atl_wrap a:link{
    opacity: 1;
}
#atl_wrap a:hover{
    text-decoration: none;
}
#atl_wrap img {
    border: none;
    width: 100%;
    vertical-align: bottom;
    line-height: inherit;
}
#atl_wrap .head_wrap{
	margin: 0 auto;
}

.topImg{
	width: 1000px;
	margin: 0 auto;
}

.topImg img{
	width: 100%;
}

.img_box1 {
    position: relative; 
    overflow: hidden;
    width: 100%;
    max-width: 100%;
    aspect-ratio: 1000 / 525;
    margin: 0 auto;
}

.fade_img1 {
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    margin: 0 auto;
    position: absolute;
    z-index: 0;
    animation: anime 4s 0s infinite;
}

.fade_img1 img{
	width: 100%;
    height: 100%;
	object-fit: cover; 
}

.fade_img1:nth-of-type(2) {
    -webkit-animation-delay: 2s;
    animation-delay: 2s;
}

@keyframes anime {
    0% {
        opacity: 1;
    }
    50% {
        opacity: 1;
    }
    60% {
        opacity: 0;
        z-index: 10;
    }
    100% {
        opacity: 0;
    }
}
#atl_wrap .head_box .top_img img{
    margin: 0 0 80px;
}
#atl_wrap .head_box .title{
	color: #8f8077;
    font-size: 32px;
    font-weight: bold;
    text-align: center;
    letter-spacing: 0.05em;
    margin: 40px 0 34px;
    line-height: 1.4;
}
#atl_wrap .head_box .lead{
    font-size: 18px;
    color: #333;
    line-height: 2;
    text-align: center;
}
#atl_wrap .head_box .releasedate{
    text-align: left;
    font-size: 16px;
    color: #333333;
    margin: 0;
    padding: 39px 0 86px 29px;
    line-height: 1;
    font-family: '游明朝', 'Yu Mincho', YuMincho, 'Hiragino Mincho Pro', serif;
}
#atl_wrap .detail_box{
	background: #ece9e7;
	padding: 50px 80px;
	gap: 49px;
    display: flex;
	margin: 0 0 80px;
	text-align: left;
}
#atl_wrap .detail_box .title{
	font-size: 26px;
    font-weight: bold;
    color: #8f8077;
    line-height: 1.4;
}
#atl_wrap .detail_box .lead{
    font-size: 14px;
    line-height: 1.7;
	margin: 14px 0;
}
#atl_wrap .detail_box .img{
    width: 200px;
    flex-shrink: 0;
}

#atl_wrap .detail_box_sp{
	background: #ece9e7;
	text-align: left;
}
#atl_wrap .detail_box_sp .title{
	font-size: 20px;
    font-weight: bold;
    color: #8f8077;
	margin-bottom: 3%;
}
#atl_wrap .detail_box_sp .sub_box{
    display: flex;
	column-gap: 1%;
}
#atl_wrap .detail_box_sp .lead{
    font-size: 13px;
    line-height: 1.7;
	width: 60%;
}
#atl_wrap .detail_box_sp .img{
    width: 40%;
}

#atl_wrap .head_wrap ul{
	display: flex;
	justify-content: center;
	column-gap: 20px;
}

#atl_wrap .head_wrap ul li a{
	color: #ffffff;
    font-size: 18px;
    box-sizing: border-box;
    display: flex;
    justify-content: center;
    align-items: center;
    width: 470px;
    height: 70px;
    border-radius: 35px;
    font-weight: bold;
}
#atl_wrap .head_wrap ul li a.btn01{
	background: #d4c68f;
}
#atl_wrap .head_wrap ul li a.btn02{
	background: #b9a88d;
}

.section_flex{
	display: flex;
	flex-wrap: wrap;
    flex-direction: row;
}

.function_variation{
	border-color: #b9a88d;
    border-style: solid;
    border-width: 1px 0;
    box-sizing: border-box;
    color: #b9a88d;
    display: grid;
    align-items: center;
    grid-template-columns: 75px 1fr;
    padding: 15px 0 15px 9px;
    margin: 20px auto 75px;
    min-height: 76px;
    width: 440px;
    position: relative;
    left: -4px;
}

.function_variation2{
	border-color: #b9a88d;
    border-style: solid;
    border-width: 1px 0;
    box-sizing: border-box;
    color: #b9a88d;
    display: grid;
    align-items: center;
    grid-template-columns: 75px 1fr;
    padding: 15px 0 15px 9px;
    margin: 26px auto 75px;
    min-height: 76px;
    width: 440px;
    position: relative;
    left: -4px;
}


#atl_wrap .plus_section{
    padding: 86px 0 0 0;
    position: relative;
    z-index: 2;
}

.cate_bag{
	width: 50%;
}

#atl_wrap .plus_section::after{
    content: "";
    width: 100%;
    height: 660px;
    position: absolute;
    top: 0;
    left: 0;
    z-index: -1;
}

#atl_wrap .plus_section .sub_ttl1 {
    color: #8f8077;
	font-weight: bold;
	font-size: 35px;
	margin: 0 0 60px;
}

#atl_wrap .plus_section .title img{
	width: 55%;
	margin: 0 0 30px;
}

#atl_wrap .plus_section .sub_ttl{
    margin: 42px auto 40px;
    padding: 0;
    text-align: center;
    color: #d4a18f;
    font-size: 28px;
    font-weight: bold;
    width: 774px;
    height: 38px;
    display: flex;
    justify-content: center;
    align-items: center;
    background: #ffffff;	
}

#atl_wrap .plus_section .plus_top{
    overflow: hidden;
    position: relative;
    text-align: center;
}
#atl_wrap .plus_section .plus_top img{
    width: 29%;
}
#atl_wrap .plus_section .plus_top .plus_txt_new{
	color: #212121;
    font-size: 16px;
    font-weight: bold;
    letter-spacing: .05em;
    line-height: 1.438;
    padding-right: 6px;
    margin: 1em auto;
    width: fit-content;
    background: #d2cac7;
}

.plus_section .plus_detail{
	text-align: left;
	margin: 33px auto 0;
}

.plus_section .plus_detail a {
    font-size: 14px;
    letter-spacing: 0.075em;
    line-height: 1.7;
    text-decoration: underline!important;
    color: #3C3C3C!important;
}	

.lavel_list{
	display: flex;
	column-gap: 10px;
	text-align: center;
}

.label{
	width: 32%;
	background: #ece9e7;
	color: #8f8077;
	padding: 5px 10px;
	font-size: 16px;
    font-weight: bold;
}

.plus_section .credit_box{
	margin-left: 5%;
    font-size: 14px;
    letter-spacing: 0.075em;
    line-height: 1.7;
    text-decoration: underline !important;
	text-align: left;
}

.plus_section .credit_box a{
    color: #3C3C3C !important;
}

#atl_wrap .plus_section .point_ttl{
    width: 12%;
	margin: 80px auto 40px;
}

.plus_section .plus_variation{
	border-color: #b9a88d;
    border-style: solid;
    border-width: 1px 0;
    box-sizing: border-box;
    color: #b9a88d;
    display: grid;
    align-items: center;
    grid-template-columns: 75px 1fr;
    padding: 15px 0 15px 0;
    margin: 42px auto 75px;
    min-height: 76px;
    width: 440px;
    position: relative;
    left: -4px;
}

.plus_section .point_title{
    border-right: 1px solid currentColor;
    color: inherit;
    display: flex;
    align-items: center;
    font-size: 16px;
    font-weight: bold;
    height: 100%;
}

.plus_section .main {
    padding-left: 30px;
}

.plus_section .color_list {
	display: flex;
    gap: 20px;
}
.plus_section .color_list .vari_color {
    color: #212121;
    font-size: 12px;
    font-weight: bold;
    letter-spacing: .06em;
    padding-left: 45px;
    position: relative;
}

.plus_section .color_list .vari_color::before {
    content: '';
    position: absolute;
    top: 50%;
    left: 0;
    translate: 0 -50%;
    height: 34px;
    width: 34px;
}

.black::before {
    background: #3c3c3c;
}
.graybeige::before {
    background: #d2cac7;
}
.khaki::before {
    background: #a8b396;
}

.plus_section .item_size{
	margin: 0 0 80px;
}
.plus_section .item_size .title{
	font-size: 32px;
    font-weight: bold;
    text-align: center;
    margin: 60px auto 30px; 
	color: #d4c68f;
}

.plus_section .item_size ul{
	display: flex;
    gap: 50px;
}

.plus_section .item_size ul li{
	width: calc((100% - 50px) / 2);
    background: #f1efe8;
    border: 1px solid #d4c68f;
    padding: 40px 30px;
    position: relative;
}

.plus_section .item_size ul li .new_icon{
	text-align: center;
    position: absolute;
    top: -22px;
    left: 0;
}

.plus_section .item_size ul li .new_icon img{
	margin-bottom: 5%;
}

.plus_section .item_size ul li .size_wrap{
	margin: 0 0 25px;
    padding: 0 15px;
    position: relative;
    z-index: 2;
	text-align: left;
	height: 50px;
}
.plus_section .item_size ul li .size_wrap img{
	width: 25%!important;
	margin-bottom: 4%;
}
.plus_section .item_size ul li .size_wrap:nth-child(1) img{
	width: 65%!important;
	margin-bottom: 0;
}
.plus_section .item_size ul li .size_wrap::after{
	content: "";
    width: 100%;
    height: 28px;
    position: absolute;
    left: 0;
    bottom: 0;
    background: #FFF;
    z-index: -1;
}

.plus_section .item_size ul li .txt{
	text-align: left;
	font-size: 14px;
    line-height: 1.7;
    padding: 0 5px;
}

.plus_section .item_size ul li .item_credit{
	text-align: left;
	font-size: 14px;
    line-height: 1.7;
    padding: 0 5px;
	margin: 3% 0 0;
}

.plus_section .item_size ul li .item_credit a{
	color: #3c3c3c;
	border-bottom: 1px solid #3c3c3c;
}

.black::before {
    background: #3c3c3c;
}
.graybeige::before {
    background: #d2cac7;
}
.khaki::before {
    background: #a8b396;
}

.scene{
	padding: 5% 0;
	background: #ece9e7;
}

.scene .title,
.size_section .title,
.point_section .title,
.voice_section .title{
    color: #8f8077;
    font-size: 36px;
    font-weight: bold;
    letter-spacing: .05em;
    text-align: center;
    margin: 0 0 40px;
}

.scene .txt{
	color: #8f8077;
    font-size: 22px!important;
    font-weight: bold;
    letter-spacing: .05em;
    line-height: calc(28 / 20);
    margin: 0 0 8px;
}

.scene .plus_detail{
	text-align: left;
}

.scene .plus_detail a{
	color: #000000;
	text-decoration: underline!important;
}

.scene .credit_box{
	margin-top: 1%;
}

/************************************************************
other
************************************************************/
.strong{
    font-size: 105%;
    font-weight: bold;
}

.small{
    font-size: 70%;
}

.clear {
	clear: both;
}
.pc{
	display: block!important;
}
.sp{
	display: none!important;
}

/************************************************************
スライダー
************************************************************/
.slider-container5,
.slider-container6,
.slider-container7,
.slider-container8{
  width: 90%; /* スライダー全体の幅 */
  margin: 0 auto;
  overflow: hidden; /* 親要素からはみ出た部分を隠す */
  position: relative;
}

.slider-container9{
	width: 55%;
	margin: 0 auto;
    overflow: hidden; /* 親要素からはみ出た部分を隠す */
    position: relative;
}

.slider-container14{
	width: 85%;
	margin: 0 auto;
    overflow: hidden; /* 親要素からはみ出た部分を隠す */
    position: relative;
}

.slider-slides5 {
  display: flex; /* 画像を横並びにする */
  width: 500%; /* (画像5枚分) = 画像1枚の幅(100%) × 5枚 */
  transition: transform 0.5s ease; /* スライドのアニメーション */
}
.slider-slides6 {
  display: flex; /* 画像を横並びにする */
  width: 400%; /* (画像4枚分) = 画像1枚の幅(100%) × 4枚 */
  transition: transform 0.5s ease; /* スライドのアニメーション */
}
.slider-slides7 {
  display: flex; /* 画像を横並びにする */
  width: 400%; /* (画像4枚分) = 画像1枚の幅(100%) × 4枚 */
  transition: transform 0.5s ease; /* スライドのアニメーション */
}
.slider-slides8 {
  display: flex; /* 画像を横並びにする */
  width: 400%; /* (画像4枚分) = 画像1枚の幅(100%) × 4枚 */
  transition: transform 0.5s ease; /* スライドのアニメーション */
}

.slider-slides9 {
  display: flex; /* 画像を横並びにする */
  width: 500%; /* (画像5枚分) = 画像1枚の幅(100%) × 5枚 */
  transition: transform 0.5s ease; /* スライドのアニメーション */
}


.slider-slides14{
  display: flex; /* 画像を横並びにする */
  width: 500%; /* (画像5枚分) = 画像1枚の幅(100%) × 5枚 */
  transition: transform 0.5s ease; /* スライドのアニメーション */
}

.slider-image {
  width: 100%;
}

.slider-image img {
  width: 100%;
  height: auto;
  display: block;
}

/* ラジオボタンを非表示にする */
.slider-slides5 input,
.slider-slides6 input,
.slider-slides7 input,
.slider-slides8 input,
.slider-slides9 input,
.slider-slides14 input{
  display: none;
}

/* ラジオボタンがチェックされた時にスライドを切り替える */
#slide5_1:checked ~ .slider-image.slide5_1,
#slide5_2:checked ~ .slider-image.slide5_2,
#slide5_3:checked ~ .slider-image.slide5_3,
#slide5_4:checked ~ .slider-image.slide5_4,
#slide5_5:checked ~ .slider-image.slide5_5,
#slide6_1:checked ~ .slider-image.slide6_1,
#slide6_2:checked ~ .slider-image.slide6_2,
#slide6_3:checked ~ .slider-image.slide6_3,
#slide6_4:checked ~ .slider-image.slide6_4,
#slide7_1:checked ~ .slider-image.slide7_1,
#slide7_2:checked ~ .slider-image.slide7_2,
#slide7_3:checked ~ .slider-image.slide7_3,
#slide7_4:checked ~ .slider-image.slide7_4,
#slide8_1:checked ~ .slider-image.slide8_1,
#slide8_2:checked ~ .slider-image.slide8_2,
#slide8_3:checked ~ .slider-image.slide8_3,
#slide8_4:checked ~ .slider-image.slide8_4,
#slide9_1:checked ~ .slider-image.slide9_1,
#slide9_2:checked ~ .slider-image.slide9_2,
#slide9_3:checked ~ .slider-image.slide9_3,
#slide9_4:checked ~ .slider-image.slide9_4,
#slide9_5:checked ~ .slider-image.slide9_5,
#slide14_1:checked ~ .slider-image.slide14_1,
#slide14_2:checked ~ .slider-image.slide14_2,
#slide14_3:checked ~ .slider-image.slide14_3,
#slide14_4:checked ~ .slider-image.slide14_4,
#slide14_5:checked ~ .slider-image.slide14_5{
}

#slide5_1:checked ~ .slider-image,
#slide5_2:checked ~ .slider-image,
#slide5_3:checked ~ .slider-image,
#slide5_4:checked ~ .slider-image,
#slide5_5:checked ~ .slider-image,
#slide6_1:checked ~ .slider-image,
#slide6_2:checked ~ .slider-image,
#slide6_3:checked ~ .slider-image,
#slide6_4:checked ~ .slider-image,
#slide7_1:checked ~ .slider-image,
#slide7_2:checked ~ .slider-image,
#slide7_3:checked ~ .slider-image,
#slide7_4:checked ~ .slider-image,
#slide8_1:checked ~ .slider-image,
#slide8_2:checked ~ .slider-image,
#slide8_3:checked ~ .slider-image,
#slide8_4:checked ~ .slider-image,
#slide9_1:checked ~ .slider-image,
#slide9_2:checked ~ .slider-image,
#slide9_3:checked ~ .slider-image,
#slide9_4:checked ~ .slider-image,
#slide9_5:checked ~ .slider-image,
#slide14_1:checked ~ .slider-image,
#slide14_2:checked ~ .slider-image,
#slide14_3:checked ~ .slider-image,
#slide14_4:checked ~ .slider-image,
#slide14_5:checked ~ .slider-image{
  transition: transform 0.5s ease;
}

#slide5_1:checked ~ .slider-image {
  transform: translateX(0%);
}
#slide5_2:checked ~ .slider-image {
  transform: translateX(-100%);
}
#slide5_3:checked ~ .slider-image {
  transform: translateX(-200%);
}
#slide5_4:checked ~ .slider-image {
  transform: translateX(-300%);
}
#slide5_5:checked ~ .slider-image {
  transform: translateX(-400%);
}

#slide6_1:checked ~ .slider-image {
  transform: translateX(0%);
}
#slide6_2:checked ~ .slider-image {
  transform: translateX(-100%);
}
#slide6_3:checked ~ .slider-image {
  transform: translateX(-200%);
}
#slide6_4:checked ~ .slider-image {
  transform: translateX(-300%);
}

#slide7_1:checked ~ .slider-image {
  transform: translateX(0%);
}
#slide7_2:checked ~ .slider-image {
  transform: translateX(-100%);
}
#slide7_3:checked ~ .slider-image {
  transform: translateX(-200%);
}
#slide7_4:checked ~ .slider-image {
  transform: translateX(-300%);
}

#slide8_1:checked ~ .slider-image {
  transform: translateX(0%);
}
#slide8_2:checked ~ .slider-image {
  transform: translateX(-100%);
}
#slide8_3:checked ~ .slider-image {
  transform: translateX(-200%);
}
#slide8_4:checked ~ .slider-image {
  transform: translateX(-300%);
}

#slide9_1:checked ~ .slider-image {
  transform: translateX(0%);
}
#slide9_2:checked ~ .slider-image {
  transform: translateX(-100%);
}
#slide9_3:checked ~ .slider-image {
  transform: translateX(-200%);
}
#slide9_4:checked ~ .slider-image {
  transform: translateX(-300%);
}
#slide9_5:checked ~ .slider-image {
  transform: translateX(-400%);
}

#slide14_1:checked ~ .slider-image {
  transform: translateX(0%);
}
#slide14_2:checked ~ .slider-image {
  transform: translateX(-100%);
}
#slide14_3:checked ~ .slider-image {
  transform: translateX(-200%);
}
#slide14_4:checked ~ .slider-image {
  transform: translateX(-300%);
}
#slide14_5:checked ~ .slider-image {
  transform: translateX(-400%);
}

/* ナビゲーションドットのスタイル */
.slider-nav5,
.slider-nav6,
.slider-nav7,
.slider-nav8,
.slider-nav9,
.slider-nav14{
    text-align: center;
    margin-top: 10px;
}


.slider-nav5 .arrow_next5,
.slider-nav6 .arrow_next6,
.slider-nav7 .arrow_next7,
.slider-nav8 .arrow_next8,
.slider-nav9 .arrow_next9,
.slider-nav14 .arrow_next14{
	display: inline-block;
    width: 32px;
    height: 32px;
    margin: 0 5px;
    cursor: pointer;
    transition: background-color 0.3s;
	background-image: url("../images/arrow_next.jpg");
	background-repeat: no-repeat;
}

.slider-nav5 .arrow_prev5,
.slider-nav6 .arrow_prev6,
.slider-nav7 .arrow_prev7,
.slider-nav8 .arrow_prev8,
.slider-nav9 .arrow_prev9,
.slider-nav14 .arrow_prev14{
    display: inline-block;
    width: 32px;
    height: 32px;
    margin: 0 5px;
    cursor: pointer;
    transition: background-color 0.3s;
	background-image: url("../images/arrow_prev.jpg");
	background-repeat: no-repeat;
}

.pos5{
    position: absolute;
    top: 33%;
    left: 0;
}
.pos6{
    position: absolute;
    top: 33%;
    right: 0;
}

.pos7{
    position: absolute;
    top: 33%;
    left: 0;
}
.pos8{
    position: absolute;
    top: 33%;
    right: 0;
}

.pos9{
    position: absolute;
    top: 33%;
    left: 0;
}
.pos10{
    position: absolute;
    top: 33%;
    right: 0;
}

.pos11{
    position: absolute;
    top: 33%;
    left: 0;
}
.pos12{
    position: absolute;
    top: 33%;
    right: 0;
}

.pos13{
    position: absolute;
    top: 37%;
    left: 0;
}
.pos14{
    position: absolute;
    top: 37%;
    right: 0;
}

.pos23{
    position: absolute;
    top: 45%;
    left: 0;
}
.pos24{
    position: absolute;
    top: 45%;
    right: 0;
}

.slider-image .txt{
	font-size: 16px;
    line-height: 1.8;
    margin: 25px 0 0 0;
    padding: 0;
    text-align: left;
}

.slider14_bg{
	background: #ffffff;
	padding: 5% 0;
}

.size_txt{
	position: relative;
	margin-bottom: 2%;
}

.size_title{
    color: #8f8077;
    font-size: 22px;
    font-weight: bold;
    letter-spacing: .05em;
    text-align: center;
    margin: 0;
	line-height: 1;
}

.model_cm{
	position: absolute;
	top: 0;
	right: 0;
}

.model_cm_sp{
	margin: 3% auto;
	text-align: right;
}

/************************************************************
 タブ
************************************************************/
.tab_section{
    margin: 10% 0 0;
}

.tabs {
	width: 100%;
    margin-top: 80px;
    margin-bottom: 30px;
    padding-bottom: 10%;
    margin: 0 auto;
    position: relative;
}

.tab_item {
	width: calc((100% - 30px) / 4);
    height: 70px;
    margin: 0 10px 0 0;
    padding: 0;
    font-size: 1.3rem;
    font-weight: bold;
    font-family: "futura-pt", sans-serif;
    letter-spacing: 0.1em;
    text-align: center;
    display: flex;
    align-items: center;
    justify-content: center;
    float: left;
    box-sizing: border-box;
    background: #ece9e7;
    color: #b9a88d;
    border-radius: 4px;
    border: none;
    cursor: pointer;
    opacity: 1;
}

.tab_item span {
	font-size: 50%;
	line-height: 1.2;
}

.tab_item[for="tote"] {
    margin-right: 0;
}

.tab_item span {
    font-size: 50%;
    line-height: 1.2;
}

input[name="tab_item"] {
    display: none;
}

.tab_content {
    display: none;
    padding: 0;
    clear: both;
    overflow: hidden;
	position: relative;
}

.tab_content img {
	width: 100%;
	margin: 0;
}

#multi:checked ~ #multi_content,
#plus:checked ~ #plus_content,
#function:checked ~ #function_content,
#tote:checked ~ #tote_content{
    display: block;
}

.tabs input:checked + .tab_item {
	background: #ffffff;
    color: #8f8077;
    border: 2px solid #8f8077;
    border-bottom: 2px solid #ffffff;
    border-radius: 4px 4px 0 0;
    height: 77px;
    margin-bottom: -2px;
    position: relative;
    z-index: 2;
    opacity: 1;
}

.tab_box {
	margin: 0 auto;
    padding: 7% 3%;
    z-index: 1;
    line-height: 1.8;
    background-color: #ffffff;
    border-top: 2px solid #8f8077;
    box-sizing: border-box;
	display: flex;
	align-items: center;
}

.tab_text{
	width: 45%;
	text-align: center;
}

.tab1_title{
	color: #8f8077;
    font-size: 24px;
    line-height: calc(28 / 24);
    padding-inline: .5em;
    position: relative;
	font-weight: 600;
}

.tab1_title span::before{
	left: 28%;
    rotate: -34deg;
}

.tab1_title span::after{
	right: 28%;
    rotate: 34deg;
}

.tab1_title span::before,
.tab1_title span::after{
	content: '';
    background-color: currentColor;
    height: 1em;
    width: 2px;
    position: absolute;
    bottom: .2em;
}

.tab1_subttl{
	color: #8f8077;
	font-weight: 600;
	font-size: 35px;
	margin: 0 0 20px;
}

.tab1_sub{
	color: #8f8077;
	font-weight: 600;
	font-size: 20px;
	margin: 0 0 8px;
}

.tab1_lead{
	font-size: 18px;
}

.tab_txt{
	color: #8f8077;
    font-size: 22px;
    font-weight: bold;
    line-height: calc(24 / 20);
    text-align: center;
    margin: 0 0 8px;
}

.tab_lead{
    font-size: 18px;
    line-height: calc(30 / 16);
    text-align: center;
    margin: 0 0 40px;
}

/*タブ部分スライダー*/

.slider-container10,
.slider-container11,
.slider-container12,
.slider-container13{
    width: 55%;
    margin: 0 auto;
    overflow: hidden; /* 親要素からはみ出た部分を隠す */
    position: relative;
}


.slider-slides10,
.slider-slides11,
.slider-slides12,
.slider-slides13{
  display: flex; /* 画像を横並びにする */
  width: 200%; /* (画像2枚分) = 画像1枚の幅(100%) × 2枚 */
  transition: transform 0.5s ease; /* スライドのアニメーション */
}

.slider-image {
  width: 100%;
}

.slider-image img {
  width: 100%;
  height: auto;
  display: block;
}

/* ラジオボタンを非表示にする */
.slider-slides10 input,
.slider-slides11 input,
.slider-slides12 input,
.slider-slides13 input{
  display: none;
}

/* ラジオボタンがチェックされた時にスライドを切り替える */
#slide10_1:checked ~ .slider-image.slide10_1,
#slide10_2:checked ~ .slider-image.slide10_2,
#slide11_1:checked ~ .slider-image.slide11_1,
#slide11_2:checked ~ .slider-image.slide11_2,
#slide12_1:checked ~ .slider-image.slide12_1,
#slide12_2:checked ~ .slider-image.slide12_2,
#slide13_1:checked ~ .slider-image.slide13_1,
#slide13_2:checked ~ .slider-image.slide13_2{
}
#slide10_1:checked ~ .slider-image,
#slide10_2:checked ~ .slider-image,
#slide11_1:checked ~ .slider-image,
#slide11_2:checked ~ .slider-image,
#slide12_1:checked ~ .slider-image,
#slide12_2:checked ~ .slider-image,
#slide13_1:checked ~ .slider-image,
#slide13_2:checked ~ .slider-image{
  transition: transform 0.5s ease;
}


#slide10_1:checked ~ .slider-image,
#slide11_1:checked ~ .slider-image,
#slide12_1:checked ~ .slider-image,
#slide13_1:checked ~ .slider-image{
  transform: translateX(0%);
}
#slide10_2:checked ~ .slider-image,
#slide11_2:checked ~ .slider-image, 
#slide12_2:checked ~ .slider-image, 
#slide13_2:checked ~ .slider-image{
  transform: translateX(-100%);
}

/* ナビゲーションドットのスタイル */
.slider-nav10,
.slider-nav11,
.slider-nav12,
.slider-nav13{
    text-align: center;
    margin-top: 10px;
}


.slider-nav10 .arrow_next10,
.slider-nav11 .arrow_next11,
.slider-nav12 .arrow_next12,
.slider-nav13 .arrow_next13{
    display: inline-block;
    width: 32px;
    height: 32px;
    margin: 0 5px;
    cursor: pointer;
    transition: background-color 0.3s;
    background-image: url("https://www.dot-st.com/static/docs/afternoon-tea-net/keyword/260724_mujuryoku/images/arrow_next.jpg");
    background-repeat: no-repeat;
}

.slider-nav10 .arrow_prev10,
.slider-nav11 .arrow_prev11,
.slider-nav12 .arrow_prev12,
.slider-nav13 .arrow_prev13{
    display: inline-block;
    width: 32px;
    height: 32px;
    margin: 0 5px;
    cursor: pointer;
    transition: background-color 0.3s;
    background-image: url("https://www.dot-st.com/static/docs/afternoon-tea-net/keyword/260724_mujuryoku/images/arrow_prev.jpg");
    background-repeat: no-repeat;
}

.pos15{
    position: absolute;
    top: 45%;
    left: 0;
}
.pos16{
    position: absolute;
    top: 45%;
    right: 0;
}

.pos17{
    position: absolute;
    top: 45%;
    left: 0;
}
.pos18{
    position: absolute;
    top: 45%;
    right: 0;
}

.pos19{
    position: absolute;
    top: 45%;
    left: 0;
}
.pos20{
    position: absolute;
    top: 45%;
    right: 0;
}

.pos21{
    position: absolute;
    top: 45%;
    left: 0;
}
.pos22{
    position: absolute;
    top: 45%;
    right: 0;
}



/************************************************************
サイズ
************************************************************/
.size_section{
	background: #ece9e7;
	padding: 5% 0;
}

.size_img{
	display: flex;
}


/************************************************************
 ポイント
************************************************************/
.point_section{
	margin: 5% 0;
}

.point_wrap{
	display: flex;
	flex-wrap: wrap;
	column-gap: 3%;
	justify-content: center;
}

.point_wrap img{
	width: 47%!important;
	margin-bottom: 3%;
}


/************************************************************
お客様の声
************************************************************/
.review-item {
    display: flex;
    align-items: flex-start;
    gap: 32px;
    margin-bottom: 56px;
    width: 100%;
	text-align: left;
}

.review-item h3{
	margin: 0!important;
}

.review-item h4{
	margin: 10px 0!important;
}

.review-item--reverse {
	flex-direction: row-reverse;
}

.avatar-box {
    flex-shrink: 0;
    overflow: hidden;
    display: flex;
    justify-content: center;
    align-items: center;
}

.avatar-box img{
    width: 90px!important;
}

.avatar-image {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

/* 吹き出しコンテナ */
.bubble {
    position: relative;
    flex-grow: 1;
    background-color: #ece9e7;
    border-radius: 12px;
    padding: 30px 40px;
}

.review-item .bubble::before {
    content: "";
    position: absolute;
    top: 36px;
    left: -14px;
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 8px 14px 8px 0;
    border-color: transparent #eeeae5 transparent transparent;
}

.review-item--reverse .bubble::before {
    content: "";
    position: absolute;
    top: 36px;
    left: auto;
    right: -14px;
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 8px 0 8px 14px;
    border-color: transparent transparent transparent #eeeae5;
}

.review-title {
    font-size: 20px;
    font-weight: 700;
    color: #8f8077;
    margin-bottom: 4px;
    letter-spacing: 0.03em;
}

.review-product {
    font-size: 17px;
    font-weight: 700;
    color: #3C3C3C;
    margin-bottom: 12px;
    letter-spacing: 0.02em;
}

.review-text {
    font-size: 16px;
    font-weight: 400;
    color: #3C3C3C;
    line-height: 1.8;
    letter-spacing: 0.04em;
	margin-bottom: 0;
}

.review-author {
    font-size: 14px;
    font-weight: 400;
    color: #3C3C3C;
    letter-spacing: 0.04em;
}

/************************************************************
お客様の声
************************************************************/
.tote_section{
	padding: 5% 0 0;
}

.tote_head img{
	margin: 0 0 80px;
}

.tote_head .head_title{
	margin-bottom: 3%;
}

.tote_head .head_title span{
	font-size: 36px;
    font-weight: bold;
    margin-bottom: 45px;
    color: #8f8077;
    position: relative;
    padding: 0 1em;
}
.tote_head .head_title span::before{
	left: 10px;
    transform: rotate(-35deg);
}
.tote_head .head_title span::after{
	right: 10px;
    transform: rotate(35deg);
}

.tote_head .head_title span::before,
.tote_head .head_title span::after{
	content: "";
    position: absolute;
    bottom: 5px;
    width: 1px;
    height: 35px;
    background-color: #755e5d;
}

.tote_section .title{
    position: relative;
    top: auto;
    z-index: 0;
    padding: 0;
    width: auto;
    color: #bcb5aa;
    font-size: 22px;
    font-weight: bold;
    text-align: center;
    letter-spacing: 0.05em;
    margin: 0 0 30px;
    line-height: 1.4;
}

/************************************************************
 ボタン
************************************************************/

.btn_all a {
	font-family:"Hiragino Sans", "Hiragino Kaku Gothic ProN", Meiryo, "sans-serif";
    background: #8f8077;
    color: #ffffff;
    font-size: 15px;
    width: 30%;
    line-height: 2em;
    letter-spacing: 2px;
    margin: 5% auto 10%;
    display: inline-block;
    padding: 2% 0;
	border-radius: 15px;
	text-decoration: none;
}

/************************************************************
 sp
************************************************************/

@media only screen and (max-width:768px){
	#atl_wrap {
        width:100%;
	}
	
    #atl_contents {
      width: 95%;
    }
	
	.topImg{
        width: 100%;
        margin: 0 auto;
    }
	
    #atl_wrap .inner{
        max-width: 95%;
    }
	
    .img_box1 {
        aspect-ratio: 1 / 1;
    }	
	
	#atl_wrap .head_box .top_img img{
		margin: 0 0 40px;
	}

    #atl_wrap .head_box .title{
        font-size: 20px;
		margin-bottom: 15px;
    }	
	
    #atl_wrap .head_box .lead {
        font-size: 14px;
    }	
	
    #atl_wrap .head_box .releasedate {
        font-size: 13px;
        padding: 39px 0 35px 0;
    }
	
    #atl_wrap .plus_section {
        padding: 40px 0 0 0;
    }
	
    #atl_wrap .plus_section .title img {
        width: 80%;
    }
	
    #atl_wrap .plus_section .sub_ttl {
        margin: 25px auto 15px;
        font-size: 16px;
		width: 85%;
		padding: 5px;
		height: 50px;
    }	
	
    #atl_wrap .plus_section .plus_top .plus_txt_new {
        font-size: 14px;
    }
	
    #atl_wrap .plus_section .point_ttl {
        width: 20%;
        margin: 100px auto 40px;
    }	
	
    #atl_wrap .plus_section::after {
        height: 790px;
    }	
	
    .plus_section .plus_detail {
        width: 100%;
		margin-top: 5%;
    }	
	
    .plus_section .plus_variation {
        width: 90%;
		padding: 15px 0;
    }
	
    .plus_section .item_size .title {
        font-size: 23px;
		margin: 60px auto 50px;
    }
	
    .plus_section .item_size ul {
        display: flex;
        gap: 10px;
		flex-wrap: wrap;
		justify-content: center;
    }  
	
	.plus_section .item_size ul li {
        padding: 15px;
		width: 48%;
    }
	
    .plus_section .item_size ul li .size_wrap {
        margin: 0;
    }
	
    .plus_section .item_size ul li .size_wrap img {
        width: 40% !important;
    }	
	
	.plus_section .item_size ul li .size_wrap:nth-child(1) img {
        width: 100% !important;
    }
	
    .plus_section .item_size ul li .size_wrap::after {
        height: 15px;
        bottom: 26px;
    }	
	
    .plus_section .item_size ul li .txt {
        font-size: 13px;
    }

    .plus_section .item_size ul li .item_credit {
        font-size: 13px;
    }	
	
	.slider-image .txt {
        font-size: 14px;
    }
	
    .slider-container,
	.slider-container3{
      width: 95%;
    }	
	
    .slider-container2,
	.slider-container4,
	.slider-container6{
        width: 90%;
    }	
	
	.slider-nav2 .pos3,
	.slider-nav2 .pos4{
		transform: translateY(-320%);
	}
	
	.cate_bag{
		width: 100%;
	}
	
    .label {
        font-size: 13px;
		white-space: nowrap;
    }
	
    .tab_box {
        flex-direction: column;
    }   
	
	.tab_txt{
		font-size: 16px;
	}
	
	.tab_lead{
		font-size: 13px;
		margin: 0 0 0 0;
	}
	
	.tab_text {
        width: 100%;
		margin-top: 5%;
    }	
	
    .tab1_title {
        font-size: 16px;
    }
	
    .tab1_sub {
        font-size: 16px;
    }
	
    .tab1_subttl {
        font-size: 25px;
		margin: 0px 0 10px;
    }	
	
    .tab1_lead {
        font-size: 13px;
    }    
	
	.tab_item {
        font-size: 11px;
		height: 40px;
    }
	
    .tab_item p{
        white-space: nowrap;
    }	
	
    .tabs input:checked + .tab_item {
		height: 40px;
    }	
	
    .slider-container9 {
        width: 90%;
    }	

    .slider-container10, .slider-container11, .slider-container12, .slider-container13 {
        width: 100%;
    }	
    .slider-container9 {
        width: 90%;
    }	

    .slider-container10, .slider-container11, .slider-container12, .slider-container13 {
        width: 100%;
    }	
	
    .scene .title,.size_section .title{
		font-size: 20px;
		margin: 30px 0 20px;
    }	
	
    .point_section .title {
        font-size: 20px;
		margin: 60px 0 20px;
    }	
	
    .voice_section .title {
        font-size: 20px;
		margin: 60px 0 20px;
    }		
	
    .size_title {
        font-size: 20px;
    }
	
    .model_cm_sp {
        font-size: 11px;
    }
	

	
	.scene .txt{
		font-size: 16px!important;
		margin: 14px 0 0 0;
	}
	
	.plus_detail a{
		font-size: 13px;
	}
	
    .function_variation2 {
        width: 90%;
		left: 0px;
    }	
	
    .function_variation {
        width: 90%;
		left: 0px;
    }	
	
    .plus_section .plus_detail a {
        font-size: 13px!important;
    }	
	
    #atl_wrap .plus_section .sub_ttl1 {
        font-size: 22px;
        margin: 0px 0 30px;
    }
	
    .plus_section .point_title {
        font-size: 13px;
	}   
	
	.plus_section .color_list .vari_color::before {
        height: 25px;
        width: 25px;
    }
	
    .plus_section .color_list .vari_color {
        font-size: 10px;
        padding-left: 30px;
    }
	
    .function_variation {
        min-height: 55px;
    }	
    .function_variation2 {
        min-height: 55px;
    }	
	
    .plus_section .main {
        padding-left: 15px;
    }

    .plus_section .plus_variation {
        min-height: 55px;
        left: 0px;
    }	
	
    .avatar-box img {
        width: 55px !important;
    }	
	
    .bubble {
        padding: 15px 20px;
    }	
	
    .review-title {
        font-size: 15px;
    }	
	
    .review-product {
        font-size: 13px;
    }
	
    .review-text {
        font-size: 12px;
    }
	
    .review-author {
        font-size: 12px;
    }
	
    .tote_section .head_title span{
        font-size: 20px!important;
    }
	
    .tote_head .head_title span::before, .tote_head .head_title span::after {
        height: 17px;
    }	
	
    .pc {
		display:none!important;
	}
	.sp {
		display: block!important;
		width: 100%!important;
	}
	
	.detail_box{
		display: none!important;
	}
	
	.btn_all a {
        width: 90%;
        padding: 4.5% 0;
    }	
	
    #atl_wrap .detail_box_sp .title {
        font-size: 18px;
    }
	
	

}