@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 120px;
}
#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: 0 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;
}

/*無重力リュックplus section*/
#atl_wrap .plus_section{
    padding: 86px 0 0 0;
    position: relative;
    z-index: 2;
}

#atl_wrap .plus_section::after{
    content: "";
    width: 100%;
    height: 660px;
    position: absolute;
    top: 0;
    left: 0;
    background: #f1e9e8;
    z-index: -1;
}

#atl_wrap .plus_section .title img{
	width: 55%;
}

#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;
}	

#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 110px;
    margin: 34px 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;
}


/*function section*/
#atl_wrap .function_section{
    padding: 86px 0 0 0;
    position: relative;
    z-index: 2;
}

#atl_wrap .function_section::after{
    content: "";
    width: 100%;
    height: 660px;
    position: absolute;
    top: 0;
    left: 0;
    background: #f1efe8;
    z-index: -1;
}

#atl_wrap .function_section .title img{
	width: 60%;
}

#atl_wrap .function_section .sub_ttl{
    margin: 42px auto 40px;
    padding: 0;
    text-align: center;
    color: #d4c68f;
    font-size: 28px;
    font-weight: bold;
    width: 774px;
    height: 38px;
    display: flex;
    justify-content: center;
    align-items: center;
    background: #ffffff;	
}

#atl_wrap .function_section .function_top{
    overflow: hidden;
    position: relative;
    text-align: center;
}
#atl_wrap .function_section .function_top img{
    width: 29%;
}
#atl_wrap .function_section .function_top .function_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;
}

.function_section .function_detail{
    width: 50%;
	text-align: left;
	margin: 2% auto 0;
}

.function_section .function_detail a {
    font-size: 14px;
    letter-spacing: 0.075em;
    line-height: 1.7;
    text-decoration: underline!important;
    color: #3C3C3C!important;
}	

#atl_wrap .function_section .point_ttl{
    width: 12%;
	margin: 80px auto 40px;
}

.function_section .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: 34px auto 75px;
    min-height: 76px;
    width: 440px;
    position: relative;
    left: -4px;
}

.function_section .point_title{
    border-right: 1px solid currentColor;
    color: inherit;
    display: flex;
    align-items: center;
    font-size: 16px;
    font-weight: bold;
    height: 100%;
}

.function_section .main {
    padding-left: 30px;
}

.function_section .color_list {
	display: flex;
    gap: 20px;
	align-items: center;
}
.function_section .color_list .vari_color {
    color: #212121;
    font-size: 12px;
    font-weight: bold;
    letter-spacing: .06em;
    padding-left: 45px;
    position: relative;
}

.function_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;
}

.function_section .item_size{
	margin: 0 0 80px;
}
.function_section .item_size .title{
	font-size: 32px;
    font-weight: bold;
    text-align: center;
    margin: 60px auto 30px; 
	color: #d4c68f;
}

.function_section .item_size ul{
	display: flex;
    gap: 50px;
}

.function_section .item_size ul li{
	width: calc((100% - 50px) / 2);
    background: #f1efe8;
    border: 1px solid #d4c68f;
    padding: 40px 30px;
    position: relative;
}

.function_section .item_size ul li .new_icon{
	text-align: center;
    position: absolute;
    top: -22px;
    left: 0;
}

.function_section .item_size ul li .new_icon img{
	margin-bottom: 5%;
}

.function_section .item_size ul li .size_wrap{
	margin: 0 0 25px;
    padding: 0 15px;
    position: relative;
    z-index: 2;
	text-align: left;
	height: 50px;
}
.function_section .item_size ul li .size_wrap img{
	width: 25%!important;
	margin-bottom: 4%;
}
.function_section .item_size ul li .size_wrap:nth-child(1) img{
	width: 65%!important;
	margin-bottom: 0;
}
.function_section .item_size ul li .size_wrap::after{
	content: "";
    width: 100%;
    height: 28px;
    position: absolute;
    left: 0;
    bottom: 0;
    background: #FFF;
    z-index: -1;
}

.function_section .item_size ul li .txt{
	text-align: left;
	font-size: 14px;
    line-height: 1.7;
    padding: 0 5px;
}

.function_section .item_size ul li .item_credit{
	text-align: left;
	font-size: 14px;
    line-height: 1.7;
    padding: 0 5px;
	margin: 3% 0 0;
}

.function_section .item_size ul li .item_credit a{
	color: #3c3c3c;
	border-bottom: 1px solid #3c3c3c;
}

/*Standard Model*/
#atl_wrap .standard_section{
    padding: 86px 0 0 0;
    position: relative;
    z-index: 2;
}

#atl_wrap .standard_section::after{
    content: "";
    width: 100%;
    height: 660px;
    position: absolute;
    top: 0;
    left: 0;
    background: #edebe8;
    z-index: -1;
}

#atl_wrap .standard_section .title img{
	width: 60%;
}

#atl_wrap .standard_section .sub_ttl{
    margin: 42px auto 40px;
    padding: 0;
    text-align: center;
    color: #b9a88d;
    font-size: 28px;
    font-weight: bold;
    width: 774px;
    height: 38px;
    display: flex;
    justify-content: center;
    align-items: center;
    background: #ffffff;	
}

#atl_wrap .standard_section .standard_top{
    overflow: hidden;
    position: relative;
    text-align: center;
}
#atl_wrap .standard_section .standard_top img{
    width: 29%;
}
#atl_wrap .standard_section .standard_top .standard_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;
}

.standard_section .standard_detail{
    width: 50%;
	text-align: left;
	margin: 2% auto 0;
}

.standard_section .standard_detail a {
    font-size: 14px;
    letter-spacing: 0.075em;
    line-height: 1.7;
    text-decoration: underline!important;
    color: #3C3C3C!important;
}

#atl_wrap .standard_section .point_ttl{
    width: 12%;
	margin: 80px auto 40px;
}

.standard_section .standard_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: 34px auto 75px;
    min-height: 76px;
    width: 440px;
    position: relative;
    left: -4px;
}

.standard_section .point_title{
    border-right: 1px solid currentColor;
    color: inherit;
    display: flex;
    align-items: center;
    font-size: 16px;
    font-weight: bold;
    height: 100%;
}

.standard_section .main {
    padding-left: 30px;
}

.standard_section .color_list {
	display: flex;
    gap: 20px;
}
.standard_section .color_list .vari_color {
    color: #212121;
    font-size: 12px;
    font-weight: bold;
    letter-spacing: .06em;
    padding-left: 45px;
    position: relative;
}

.standard_section .color_list .vari_color::before {
    content: '';
    position: absolute;
    top: 50%;
    left: 0;
    translate: 0 -50%;
    height: 34px;
    width: 34px;
}

.standard_section .item_size{
	margin: 0 0 80px;
}
.standard_section .item_size .title{
	font-size: 32px;
    font-weight: bold;
    text-align: center;
    margin: 60px auto 30px; 
	color: #b9a88d;
}

.standard_section .item_size ul{
	display: flex;
    gap: 50px;
}

.standard_section .item_size ul li{
	width: calc((100% - 40px) / 3);
    background: #edebe8;
    border: 1px solid #b9a88d;
    padding: 40px 20px;
    position: relative;
}

.standard_section .item_size ul li .new_icon{
	text-align: center;
    position: absolute;
    top: -22px;
    left: 0;
}

.standard_section .item_size ul li .new_icon img{
	margin-bottom: 5%;
}

.standard_section .item_size ul li .size_wrap{
	margin: 0 0 25px;
    padding: 0 15px;
    position: relative;
    z-index: 2;
	text-align: left;
	height: 50px;
}
.standard_section .item_size ul li:nth-child(1) .size_wrap img{
	width: 35%!important;
	margin-bottom: 4%;
}
.standard_section .item_size ul li:nth-child(2) .size_wrap img{
	width: 50%!important;
	margin-bottom: 4%;
}
.standard_section .item_size ul li:nth-child(3) .size_wrap img{
	width: 40%!important;
	margin-bottom: 4%;
}

.standard_section .item_size ul li .size_wrap::after{
	content: "";
    width: 100%;
    height: 28px;
    position: absolute;
    left: 0;
    bottom: 0;
    background: #FFF;
    z-index: -1;
}

.standard_section .item_size ul li .txt{
	text-align: left;
	font-size: 14px;
    line-height: 1.7;
    padding: 0 5px;
}

.standard_section .item_size ul li .item_credit{
	text-align: left;
	font-size: 14px;
    line-height: 1.7;
    padding: 0 5px;
	margin: 3% 0 0;
}

.standard_section .item_size ul li .item_credit a{
	color: #3c3c3c;
	border-bottom: 1px solid #3c3c3c;
}

/*無重力トートの魅力 section*/
.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;
}
.tote_section .lead{
    font-size: 18px;
    color: #333;
    line-height: 1.714;
    text-align: center;
}

.tote_wrap{
	margin: 5% 0 0;
	padding: 2% 0;
	background: #e8e4df;
}
.tote_inner{
	max-width: 1000px;
	margin: 0 auto;
}
.tote_flex{
	display: flex;
	width: 90%;
	margin: 5% auto;
	column-gap: 4%;
	justify-content: center;
    align-items: center;
}

.tote_flex:nth-child(2n+1) {
	flex-direction: row; 
}
.tote_flex:nth-child(2n) {
	flex-direction: row-reverse; 
}

.tote_slide{
	width: 48%;
}

.tote_txt{
	width: 48%;
	text-align: left;
}

.tote_no{
	width: 15%;
}

.tote_title{
	font-size: 22px;
	line-height: 1.5;
    font-weight: bold;
	margin: 5% 0;
}

.tote_detail{
    font-size: 16px;
    line-height: 1.8;
}

.tote_detail span{
    color: #755e5d;
    font-weight: bold;
    background: linear-gradient(transparent 50%, #fffaf3 50%);
}


/************************************************************
other
************************************************************/
.strong{
    font-size: 105%;
    font-weight: bold;
}

.small{
    font-size: 70%;
}

.clear {
	clear: both;
}
.pc{
	display: block!important;
}
.sp{
	display: none!important;
}

/************************************************************
スライダー
************************************************************/
.slider-container {
  width: 50%; /* スライダー全体の幅 */
  margin: 0 auto;
  overflow: hidden; /* 親要素からはみ出た部分を隠す */
  position: relative;
}
.slider-container2 {
  width: 40%; /* スライダー全体の幅 */
  margin: 0 auto;
  overflow: hidden; /* 親要素からはみ出た部分を隠す */
  position: relative;
}
.slider-container3 {
  width: 50%; /* スライダー全体の幅 */
  margin: 0 auto;
  overflow: hidden; /* 親要素からはみ出た部分を隠す */
  position: relative;
}
.slider-container4 {
  width: 40%; /* スライダー全体の幅 */
  margin: 0 auto;
  overflow: hidden; /* 親要素からはみ出た部分を隠す */
  position: relative;
}
.slider-container5 {
  width: 50%; /* スライダー全体の幅 */
  margin: 0 auto;
  overflow: hidden; /* 親要素からはみ出た部分を隠す */
  position: relative;
}
.slider-container6 {
  width: 40%; /* スライダー全体の幅 */
  margin: 0 auto;
  overflow: hidden; /* 親要素からはみ出た部分を隠す */
  position: relative;
}
.slider-container7 {
  width: 100%; /* スライダー全体の幅 */
  margin: 0 auto;
  overflow: hidden; /* 親要素からはみ出た部分を隠す */
  position: relative;
}
.slider-container8 {
  width: 100%; /* スライダー全体の幅 */
  margin: 0 auto;
  overflow: hidden; /* 親要素からはみ出た部分を隠す */
  position: relative;
}
.slider-container9 {
  width: 100%; /* スライダー全体の幅 */
  margin: 0 auto;
  overflow: hidden; /* 親要素からはみ出た部分を隠す */
  position: relative;
}
.slider-container10 {
  width: 100%; /* スライダー全体の幅 */
  margin: 0 auto;
  overflow: hidden; /* 親要素からはみ出た部分を隠す */
  position: relative;
}
.slider-container11 {
  width: 100%; /* スライダー全体の幅 */
  margin: 0 auto;
  overflow: hidden; /* 親要素からはみ出た部分を隠す */
  position: relative;
}


.slider-slides {
  display: flex; /* 画像を横並びにする */
  width: 300%; /* (画像3枚分) = 画像1枚の幅(100%) × 3枚 */
  transition: transform 0.5s ease; /* スライドのアニメーション */
}

.slider-slides2 {
  display: flex; /* 画像を横並びにする */
  width: 900%; /* (画像9枚分) = 画像1枚の幅(100%) × 9枚 */
  transition: transform 0.5s ease; /* スライドのアニメーション */
}

.slider-slides3 {
  display: flex; /* 画像を横並びにする */
  width: 200%; /* (画像2枚分) = 画像1枚の幅(100%) × 2枚 */
  transition: transform 0.5s ease; /* スライドのアニメーション */
}
.slider-slides4 {
  display: flex; /* 画像を横並びにする */
  width: 600%; /* (画像6枚分) = 画像1枚の幅(100%) × 6枚 */
  transition: transform 0.5s ease; /* スライドのアニメーション */
}

.slider-slides5 {
  display: flex; /* 画像を横並びにする */
  width: 500%; /* (画像5枚分) = 画像1枚の幅(100%) × 5枚 */
  transition: transform 0.5s ease; /* スライドのアニメーション */
}
.slider-slides6 {
  display: flex; /* 画像を横並びにする */
  width: 500%; /* (画像5枚分) = 画像1枚の幅(100%) × 5枚 */
  transition: transform 0.5s ease; /* スライドのアニメーション */
}
.slider-slides7 {
  display: flex; /* 画像を横並びにする */
  width: 200%; /* (画像2枚分) = 画像1枚の幅(100%) × 2枚 */
  transition: transform 0.5s ease; /* スライドのアニメーション */
}
.slider-slides8 {
  display: flex; /* 画像を横並びにする */
  width: 200%; /* (画像2枚分) = 画像1枚の幅(100%) × 2枚 */
  transition: transform 0.5s ease; /* スライドのアニメーション */
}
.slider-slides9 {
  display: flex; /* 画像を横並びにする */
  width: 300%; /* (画像3枚分) = 画像1枚の幅(100%) × 3枚 */
  transition: transform 0.5s ease; /* スライドのアニメーション */
}
.slider-slides10 {
  display: flex; /* 画像を横並びにする */
  width: 300%; /* (画像3枚分) = 画像1枚の幅(100%) × 3枚 */
  transition: transform 0.5s ease; /* スライドのアニメーション */
}
.slider-slides11 {
  display: flex; /* 画像を横並びにする */
  width: 300%; /* (画像3枚分) = 画像1枚の幅(100%) × 3枚 */
  transition: transform 0.5s ease; /* スライドのアニメーション */
}

.slider-image {
  width: 100%;
}

.slider-image img {
  width: 100%;
  height: auto;
  display: block;
}

/* ラジオボタンを非表示にする */
.slider-slides input,
.slider-slides2 input,
.slider-slides3 input,
.slider-slides4 input,
.slider-slides5 input,
.slider-slides6 input,
.slider-slides7 input,
.slider-slides8 input,
.slider-slides9 input,
.slider-slides10 input,
.slider-slides11 input{
  display: none;
}

/* ラジオボタンがチェックされた時にスライドを切り替える */
#slide1_1:checked ~ .slider-image.slide1_1,
#slide1_2:checked ~ .slider-image.slide1_2,
#slide1_3:checked ~ .slider-image.slide1_3,
#slide2_1:checked ~ .slider-image.slide2_1,
#slide2_2:checked ~ .slider-image.slide2_2,
#slide2_3:checked ~ .slider-image.slide2_3,
#slide2_4:checked ~ .slider-image.slide2_4,
#slide2_5:checked ~ .slider-image.slide2_5,
#slide2_6:checked ~ .slider-image.slide2_6,
#slide2_7:checked ~ .slider-image.slide2_7,
#slide2_8:checked ~ .slider-image.slide2_8,
#slide2_9:checked ~ .slider-image.slide2_9,
#slide3_1:checked ~ .slider-image.slide3_1,
#slide3_2:checked ~ .slider-image.slide3_2,
#slide4_1:checked ~ .slider-image.slide4_1,
#slide4_2:checked ~ .slider-image.slide4_2,
#slide4_3:checked ~ .slider-image.slide4_3,
#slide4_4:checked ~ .slider-image.slide4_4,
#slide4_5:checked ~ .slider-image.slide4_5,
#slide4_6:checked ~ .slider-image.slide4_6,
#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,
#slide6_5:checked ~ .slider-image.slide6_5,
#slide7_1:checked ~ .slider-image.slide7_1,
#slide7_2:checked ~ .slider-image.slide7_2,
#slide8_1:checked ~ .slider-image.slide8_1,
#slide8_2:checked ~ .slider-image.slide8_2,
#slide9_1:checked ~ .slider-image.slide9_1,
#slide9_2:checked ~ .slider-image.slide9_2,
#slide9_3:checked ~ .slider-image.slide9_3,
#slide10_1:checked ~ .slider-image.slide10_1,
#slide10_2:checked ~ .slider-image.slide10_2,
#slide10_3:checked ~ .slider-image.slide10_3,
#slide11_1:checked ~ .slider-image.slide11_1,
#slide11_2:checked ~ .slider-image.slide11_2,
#slide11_3:checked ~ .slider-image.slide11_3{
  /* ここは直接的な画像表示のスタイルではないので注意 */
}

#slide1_1:checked ~ .slider-image,
#slide1_2:checked ~ .slider-image,
#slide1_3:checked ~ .slider-image,
#slide2_1:checked ~ .slider-image,
#slide2_2:checked ~ .slider-image,
#slide2_3:checked ~ .slider-image,
#slide2_4:checked ~ .slider-image,
#slide2_5:checked ~ .slider-image,
#slide2_6:checked ~ .slider-image,
#slide2_7:checked ~ .slider-image,
#slide2_8:checked ~ .slider-image,
#slide2_9:checked ~ .slider-image,
#slide3_1:checked ~ .slider-image,
#slide3_2:checked ~ .slider-image,
#slide4_1:checked ~ .slider-image,
#slide4_2:checked ~ .slider-image,
#slide4_3:checked ~ .slider-image,
#slide4_4:checked ~ .slider-image,
#slide4_5:checked ~ .slider-image,
#slide4_6:checked ~ .slider-image,
#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,
#slide6_5:checked ~ .slider-image,
#slide7_1:checked ~ .slider-image,
#slide7_2:checked ~ .slider-image,
#slide8_1:checked ~ .slider-image,
#slide8_2:checked ~ .slider-image,
#slide9_1:checked ~ .slider-image,
#slide9_2:checked ~ .slider-image,
#slide9_3:checked ~ .slider-image,
#slide10_1:checked ~ .slider-image,
#slide10_2:checked ~ .slider-image,
#slide10_3:checked ~ .slider-image,
#slide11_1:checked ~ .slider-image,
#slide11_2:checked ~ .slider-image,
#slide11_3:checked ~ .slider-image{
  transition: transform 0.5s ease;
}

#slide1_1:checked ~ .slider-image {
  transform: translateX(0);
}
#slide1_2:checked ~ .slider-image {
  transform: translateX(-100%);
}
#slide1_3:checked ~ .slider-image {
  transform: translateX(-200%);
}

#slide2_1:checked ~ .slider-image {
  transform: translateX(0);
}
#slide2_2:checked ~ .slider-image {
  transform: translateX(-100%);
}
#slide2_3:checked ~ .slider-image {
  transform: translateX(-200%);
}
#slide2_4:checked ~ .slider-image {
  transform: translateX(-300%);
}
#slide2_5:checked ~ .slider-image {
  transform: translateX(-400%);
}
#slide2_6:checked ~ .slider-image {
  transform: translateX(-500%);
}
#slide2_7:checked ~ .slider-image {
  transform: translateX(-600%);
}
#slide2_8:checked ~ .slider-image {
  transform: translateX(-700%);
}
#slide2_9:checked ~ .slider-image {
  transform: translateX(-800%);
}

#slide3_1:checked ~ .slider-image {
  transform: translateX(0%);
}
#slide3_2:checked ~ .slider-image {
  transform: translateX(-100%);
}

#slide4_1:checked ~ .slider-image {
  transform: translateX(0%);
}
#slide4_2:checked ~ .slider-image {
  transform: translateX(-100%);
}
#slide4_3:checked ~ .slider-image {
  transform: translateX(-200%);
}
#slide4_4:checked ~ .slider-image {
  transform: translateX(-300%);
}
#slide4_5:checked ~ .slider-image {
  transform: translateX(-400%);
}
#slide4_6:checked ~ .slider-image {
  transform: translateX(-500%);
}

#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%);
}
#slide6_5:checked ~ .slider-image {
  transform: translateX(-400%);
}

#slide7_1:checked ~ .slider-image {
  transform: translateX(0%);
}
#slide7_2:checked ~ .slider-image {
  transform: translateX(-100%);
}

#slide8_1:checked ~ .slider-image {
  transform: translateX(0%);
}
#slide8_2:checked ~ .slider-image {
  transform: translateX(-100%);
}

#slide9_1:checked ~ .slider-image {
  transform: translateX(0%);
}
#slide9_2:checked ~ .slider-image {
  transform: translateX(-100%);
}
#slide9_3:checked ~ .slider-image {
  transform: translateX(-200%);
}

#slide10_1:checked ~ .slider-image {
  transform: translateX(0%);
}
#slide10_2:checked ~ .slider-image {
  transform: translateX(-100%);
}
#slide10_3:checked ~ .slider-image {
  transform: translateX(-200%);
}

#slide11_1:checked ~ .slider-image {
  transform: translateX(0%);
}
#slide11_2:checked ~ .slider-image {
  transform: translateX(-100%);
}
#slide11_3:checked ~ .slider-image {
  transform: translateX(-200%);
}

/* ナビゲーションドットのスタイル */
.slider-nav,
.slider-nav2,
.slider-nav3,
.slider-nav4,
.slider-nav5,
.slider-nav6,
.slider-nav7,
.slider-nav8,
.slider-nav9,
.slider-nav10,
.slider-nav11{
    text-align: center;
    margin-top: 10px;
}

.slider-nav .arrow_next {
	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-nav .arrow_prev {
    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;
}

.slider-nav2 .arrow_next2 {
	display: inline-block;
    width: 32px;
    height: 32px;
    margin: 0 5px;
    cursor: pointer;
    transition: background-color 0.3s;
	background-image: url("../images/arrow_next2.png");
	background-repeat: no-repeat;
}

.slider-nav2 .arrow_prev2 {
    display: inline-block;
    width: 32px;
    height: 32px;
    margin: 0 5px;
    cursor: pointer;
    transition: background-color 0.3s;
	background-image: url("../images/arrow_prev2.png");
	background-repeat: no-repeat;
}

.slider-nav3 .arrow_next3 {
	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-nav3 .arrow_prev3 {
    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;
}

.slider-nav4 .arrow_next4 {
	display: inline-block;
    width: 32px;
    height: 32px;
    margin: 0 5px;
    cursor: pointer;
    transition: background-color 0.3s;
	background-image: url("../images/arrow_next2.png");
	background-repeat: no-repeat;
}

.slider-nav4 .arrow_prev4 {
    display: inline-block;
    width: 32px;
    height: 32px;
    margin: 0 5px;
    cursor: pointer;
    transition: background-color 0.3s;
	background-image: url("../images/arrow_prev2.png");
	background-repeat: no-repeat;
}

.slider-nav5 .arrow_next5 {
	display: inline-block;
    width: 32px;
    height: 32px;
    margin: 0 5px;
    cursor: pointer;
    transition: background-color 0.3s;
	background-image: url("../images/arrow_next3.jpg");
	background-repeat: no-repeat;
}

.slider-nav5 .arrow_prev5 {
    display: inline-block;
    width: 32px;
    height: 32px;
    margin: 0 5px;
    cursor: pointer;
    transition: background-color 0.3s;
	background-image: url("../images/arrow_prev3.jpg");
	background-repeat: no-repeat;
}

.slider-nav6 .arrow_next6 {
	display: inline-block;
    width: 32px;
    height: 32px;
    margin: 0 5px;
    cursor: pointer;
    transition: background-color 0.3s;
	background-image: url("../images/arrow_next2.jpg");
	background-repeat: no-repeat;
}

.slider-nav6 .arrow_prev6 {
    display: inline-block;
    width: 32px;
    height: 32px;
    margin: 0 5px;
    cursor: pointer;
    transition: background-color 0.3s;
	background-image: url("../images/arrow_prev2.jpg");
	background-repeat: no-repeat;
}
.slider-nav7 .arrow_next7 {
	display: inline-block;
    width: 32px;
    height: 32px;
    margin: 0 5px;
    cursor: pointer;
    transition: background-color 0.3s;
	background-image: url("../images/tote_arrow_next.png");
	background-repeat: no-repeat;
}

.slider-nav7 .arrow_prev7 {
    display: inline-block;
    width: 32px;
    height: 32px;
    margin: 0 5px;
    cursor: pointer;
    transition: background-color 0.3s;
	background-image: url("../images/tote_arrow_prev.png");
	background-repeat: no-repeat;
}

.slider-nav8 .arrow_next8 {
	display: inline-block;
    width: 32px;
    height: 32px;
    margin: 0 5px;
    cursor: pointer;
    transition: background-color 0.3s;
	background-image: url("../images/tote_arrow_next.png");
	background-repeat: no-repeat;
}

.slider-nav8 .arrow_prev8 {
    display: inline-block;
    width: 32px;
    height: 32px;
    margin: 0 5px;
    cursor: pointer;
    transition: background-color 0.3s;
	background-image: url("../images/tote_arrow_prev.png");
	background-repeat: no-repeat;
}

.slider-nav9 .arrow_next9 {
	display: inline-block;
    width: 32px;
    height: 32px;
    margin: 0 5px;
    cursor: pointer;
    transition: background-color 0.3s;
	background-image: url("../images/tote_arrow_next.png");
	background-repeat: no-repeat;
}

.slider-nav9 .arrow_prev9 {
    display: inline-block;
    width: 32px;
    height: 32px;
    margin: 0 5px;
    cursor: pointer;
    transition: background-color 0.3s;
	background-image: url("../images/tote_arrow_prev.png");
	background-repeat: no-repeat;
}

.slider-nav10 .arrow_next10 {
	display: inline-block;
    width: 32px;
    height: 32px;
    margin: 0 5px;
    cursor: pointer;
    transition: background-color 0.3s;
	background-image: url("../images/tote_arrow_next.png");
	background-repeat: no-repeat;
}

.slider-nav10 .arrow_prev10 {
    display: inline-block;
    width: 32px;
    height: 32px;
    margin: 0 5px;
    cursor: pointer;
    transition: background-color 0.3s;
	background-image: url("../images/tote_arrow_prev.png");
	background-repeat: no-repeat;
}

.slider-nav11 .arrow_next11 {
	display: inline-block;
    width: 32px;
    height: 32px;
    margin: 0 5px;
    cursor: pointer;
    transition: background-color 0.3s;
	background-image: url("../images/tote_arrow_next.png");
	background-repeat: no-repeat;
}

.slider-nav11 .arrow_prev11 {
    display: inline-block;
    width: 32px;
    height: 32px;
    margin: 0 5px;
    cursor: pointer;
    transition: background-color 0.3s;
	background-image: url("../images/tote_arrow_prev.png");
	background-repeat: no-repeat;
}
		
.pos1{
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    left: 0;
}

.pos2{
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    right: 0;
}

.pos3{
    position: absolute;
    top: 50%;
    transform: translateY(-260%);
    left: 0;
}

.pos4{
    position: absolute;
    top: 50%;
    transform: translateY(-245%);
    right: 0;
}

.pos5{
    position: absolute;
    top: 50%;
    transform: translateY(-400%);
    left: 0;
}

.pos6{
    position: absolute;
    top: 50%;
    transform: translateY(-400%);
    right: 0;
}

.pos7{
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    right: 0;
}
.pos8{
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    left: 0;
}

.pos9{
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    right: 0;
}
.pos10{
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    left: 0;
}
.pos11{
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    right: 0;
}
.pos12{
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    left: 0;
}
.pos13{
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    right: 0;
}


.slider-image .txt{
	font-size: 16px;
    line-height: 1.8;
    margin: 33px 0 0 0;
    padding: 0;
    text-align: left;
}

/************************************************************
 ボタン
************************************************************/

.btn_all a {
    background: #8f8077;
    color: #ffffff;
    font-size: 14px;
    font-weight: 500;
    width: 90%;
    line-height: 2em;
    letter-spacing: 1px;
    margin: 15% auto 10%;
    display: inline-block;
    padding: 4.5% 0
}

/************************************************************
 sp
************************************************************/

@media only screen and (max-width:768px){
	#atl_wrap {
        width:100%;
	}
	
    #atl_contents {
      width: 95%;
    }
	
    #atl_wrap .inner{
        max-width: 95%;
    }
	
	#atl_wrap .head_box .top_img img{
    margin: 0 0 40px;
	}

    #atl_wrap .head_box .title{
        font-size: 23px;
		margin-bottom: 15px;
    }	
	
    #atl_wrap .head_box .lead {
        font-size: 14px;
    }	
	
    #atl_wrap .head_box .releasedate {
        font-size: 13px;
        padding: 39px 0 35px 29px;
    }
	
    #atl_wrap .function_section {
        padding: 40px 0 0 0;
    }
	
    #atl_wrap .function_section .title img {
        width: 80%;
    }
	
    #atl_wrap .function_section .sub_ttl {
        margin: 25px auto 15px;
        font-size: 16px;
		width: 85%;
		padding: 5px;
		height: 50px;
    }	
	
    #atl_wrap .function_section .function_top .function_txt_new {
        font-size: 14px;
    }
	
    #atl_wrap .function_section .point_ttl {
        width: 20%;
        margin: 160px auto 40px;
    }	
	
    #atl_wrap .function_section::after {
        height: 715px;
    }	
	
    .function_section .function_detail {
        width: 95%;
    }	
	
    .function_section .function_variation {
        width: 90%;
    }
	
    .function_section .item_size .title {
        font-size: 23px;
		margin: 60px auto 50px;
    }
	
    .function_section .item_size ul {
        display: flex;
        gap: 10px;
		flex-wrap: wrap;
		justify-content: center;
    }  
	
	.function_section .item_size ul li {
        padding: 15px;
		width: 39%;
    }
	
    .function_section .item_size ul li .size_wrap {
        margin: 0;
    }
	
    .function_section .item_size ul li .size_wrap img {
        width: 40% !important;
    }	
	
	.function_section .item_size ul li .size_wrap:nth-child(1) img {
        width: 100% !important;
    }
	
    .function_section .item_size ul li .size_wrap::after {
        height: 15px;
        bottom: 26px;
    }	
	
    .function_section .item_size ul li .txt {
        font-size: 13px;
    }

    .function_section .item_size ul li .item_credit {
        font-size: 13px;
    }	
	
    #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 15px 70px;
    }
	
    .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;
    }	
	
	
	
    #atl_wrap .standard_section {
        padding: 40px 0 0 0;
    }
	
    #atl_wrap .standard_section .title img {
        width: 80%;
    }
	
    #atl_wrap .standard_section .sub_ttl {
        margin: 25px auto 15px;
        font-size: 16px;
		width: 85%;
		padding: 5px;
		height: 50px;
	}
	
    #atl_wrap .standard_section .standard_top .standard_txt_new {
        font-size: 14px;
    }
	
    #atl_wrap .standard_section .point_ttl {
        width: 20%;
        margin: 200px auto 40px;
    }	
	
    #atl_wrap .standard_section::after {
        height: 715px;
    }	
	
    .standard_section .standard_detail {
        width: 95%;
		font-size: 14px;
    }		
	
    .standard_section .standard_variation {
        width: 90%;
    }
	
    .standard_section .item_size .title {
        font-size: 23px;
		margin: 60px auto 50px;
    }
	
    .standard_section .item_size ul {
        display: flex;
        gap: 10px;
		flex-wrap: wrap;
		justify-content: center;
    }  
	
	.standard_section .item_size ul li {
        padding: 15px;
		width: 39%;
    }
	
    .standard_section .item_size ul li .size_wrap {
        margin: 0;
    }
	
    .standard_section .item_size ul li .size_wrap img {
        width: 30% !important;
    }	
	
    .standard_section .item_size ul li .size_wrap::after {
        height: 15px;
        bottom: 26px;
    }	
	
    .standard_section .item_size ul li .txt {
        font-size: 13px;
    }

    .standard_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: 85%;
    }	
	
	.slider-nav2 .pos3,
	.slider-nav2 .pos4{
		transform: translateY(-320%);
	}
	
    .tote_head .head_title span{
        font-size: 18px;
    }

    .tote_head .head_title span::before,
    .tote_head .head_title span::after{
        height: 20px;
    }	

    .tote_head img{
        margin: 0 0 40px;
    }
    .tote_section .title{
        font-size: 20px;
    }
    .tote_section .lead{
        font-size: 14px;
    }	
	
    .tote_flex{
        display: block;
		margin-bottom: 10%;
    }	
	
	.tote_slide{
		width: 100%;
		margin-bottom: 3%;
	}
	
	.tote_txt {
        width: 100%;
    }
	
	.tote_title{
		margin: 3% 0;
		font-size: 18px;
	}
	
	.tote_detail{
		font-size: 14px;
	}	

    .pc {
		display:none!important;
	}
	.sp {
		display: block!important;
		width: 100%!important;
	}
	
	.detail_box{
		display: none!important;
	}

}

