.q_container{max-width: 124rem;margin: 0 auto;}
.q_container2{max-width: 126.5rem;}

.sub_q1a{padding: 0 0 6.5rem;}
.sub_q1a .indexTil{padding: 6.6rem 0 2.3rem;color: #553927;}
.sub_q1a .article,
.sub_q1a .article p{color: #100600;line-height: 1.67em;font-size: 18px;line-height: 30px;}

.sub_q1b{display: block;width: 100%;}

.wrap_sub_q1c{position: relative;padding: 5rem 0 0rem;}
.wrap_sub_q1c::before{content: '';display: block;position: absolute;left: 0;right: 0;top: 0;bottom: -7rem;z-index: -1;background: #F2EFEA url(../images/sub_q1c_bg.svg) no-repeat center 25%/150.7rem auto;}
.sub_q1c_img{display: block;margin: 0 auto 1.4rem;width: 24.9rem;}

.wrap_sub_q1c1{position: relative;border-top: .1rem dashed #833B0A;padding: 0 3.9rem 1rem;}
.wrap_sub_q1c1::before,.wrap_sub_q1c1::after{content: '';display: block;position: absolute;width: 1.6rem;height: 1.6rem;border-radius: 50%;top: -0.9rem;border: .1rem dashed #833B0A;}
.wrap_sub_q1c1::before{left: -1.8rem;}
.wrap_sub_q1c1::after{right: -1.8rem;}
.wrap_sub_q1c1 .arrow{width: 4.5rem;height: 4.5rem;background: url(../images/volMode_arrow.svg) no-repeat center/cover;color: transparent;background-size: 2.7rem auto;cursor: pointer;position: absolute;top: 50%;z-index: 1;left: 0;display: none;}
.wrap_sub_q1c1 .next{right: 0;left: auto;transform: rotateZ(180deg);}

.sub_q1c1{overflow: hidden;}
.sub_q1c1 ul{display: flex;justify-content: space-between;}
.sub_q1c1 li{width: auto;padding: 0 1rem 1rem;}
.sub_q1c1 .item{margin: 0 0;padding: 3.2rem 3.5rem;background: #FDF9F4;box-shadow: 0rem .3rem .6rem 0rem rgba(0, 0, 0, 0.16);}
.sub_q1c1 .title{writing-mode: vertical-lr;-webkit-writing-mode: vertical-lr;-ms-writing-mode: vertical-lr;-ms-writing-mode: tb-lr;
	color: #553227;letter-spacing: .2rem;font-family: 'Noto Serif SC';min-width: 3.5rem;text-align: center;}
.sub_q1c1 .item:hover{background: #A8947A;}
.sub_q1c1 .item:hover .title{color: #fff;}
.sub_q1c1 li:hover .item{
    -webkit-animation: rotateq1c1 1s cubic-bezier(0.4, 0, 1, 1) forwards;
	animation: rotateq1c1 1s cubic-bezier(0.4, 0, 1, 1) forwards;
}
@-webkit-keyframes rotateq1c1 {
	0%{-webkit-transform: rotateY(0deg);}
	100%{-webkit-transform: rotateY(180deg);}
}
@keyframes rotateq1c1 {
	0%{transform: rotateY(0deg);}
	100%{transform: rotateY(360deg);}
}

@media screen  and (max-width:1024px){
	.wrap_sub_q1c1 .arrow{display: block;}
    .sub_q1c1 li{display: flex;justify-content: center;box-sizing: border-box;}
	.sub_q1a .article,
	.sub_q1a .article p{font-size: 16px;line-height: 28px;}
	
}
@media screen  and (max-width:414px){
	.sub_q1c1 .title{min-width: 20px;}
}