@charset "UTF-8";


.top-qa { padding-bottom: 14vw; }
.top-qa-content { width: 90vw; margin: 0 auto; }
.top-qa-tab-items { width: 100%; margin-bottom: 5vw; border-bottom: 1vw solid var(--orange); display: -webkit-box; display: -webkit-flex; display: flex; -webkit-flex-wrap: wrap; flex-wrap: wrap; -webkit-justify-content: space-between; justify-content: space-between; }
.top-qa-tab-item { width: calc(100% / 3 - 2px); padding: 2.5vw 0; color: #fff; font-size: 4.39vw; font-weight: bold; text-align: center; background: #cbcacb; -moz-border-radius: 2vw 2vw 0 0; -webkit-border-radius: 2vw; border-radius: 2vw 2vw 0 0; -moz-transition: all 0.4s cubic-bezier(0.05, 0.05, 0.31, 0.97); -o-transition: all 0.4s cubic-bezier(0.05, 0.05, 0.31, 0.97); -webkit-transition: all 0.4s cubic-bezier(0.05, 0.05, 0.31, 0.97); transition: all 0.4s cubic-bezier(0.05, 0.05, 0.31, 0.97); }
.top-qa-tab-item.active { background: var(--orange); }
.top-qa-items { margin: 0 auto 6vw; }
.top-qa-item { width: 100%;}
.top-qa-item.active { display: block; }
.top-qa-initem { margin-bottom: 4vw; }
.top-qa-initem-question { padding: 4vw 10vw 4vw 12vw; font-size: 3.86vw; text-align: justify; text-justify: inter-ideograph; font-feature-settings: "palt"; line-height: 1.6; letter-spacing: 0.04em; border: 1px solid #ccc; position: relative; }
.top-qa-initem-question p{margin-bottom: 0;}
.top-qa-initem-question.open .plus:after { -moz-transform: translate(-50%, -50%) rotate(90deg); -ms-transform: translate(-50%, -50%) rotate(90deg); -webkit-transform: translate(-50%, -50%) rotate(90deg); transform: translate(-50%, -50%) rotate(90deg); }
.top-qa-initem-question:before { content: 'Q.'; font-size: 4.91vw; font-family: "lato"; font-weight: 600; letter-spacing: 0.8vw; position: absolute; top: 3vw; left: 3.5vw; }
.top-qa-initem-question .plus { width: 4vw; height: 4vw; position: absolute; top: 50%; right: 4vw; -moz-transform: translateY(-50%); -ms-transform: translateY(-50%); -webkit-transform: translateY(-50%); transform: translateY(-50%); }
.top-qa-initem-question .plus:before { content: ''; width: 100%; height: 1px; background: #ddd; position: absolute; top: 50%; left: 50%; -moz-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); -webkit-transform: translate(-50%, -50%); transform: translate(-50%, -50%); -moz-transition: all 0.3s cubic-bezier(0.05, 0.05, 0.31, 0.97); -o-transition: all 0.3s cubic-bezier(0.05, 0.05, 0.31, 0.97); -webkit-transition: all 0.3s cubic-bezier(0.05, 0.05, 0.31, 0.97); transition: all 0.3s cubic-bezier(0.05, 0.05, 0.31, 0.97); }
.top-qa-initem-question .plus:after { content: ''; width: 1px; height: 100%; background: #ddd; position: absolute; top: 50%; left: 50%; -moz-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); -webkit-transform: translate(-50%, -50%); transform: translate(-50%, -50%); -moz-transition: all 0.3s cubic-bezier(0.05, 0.05, 0.31, 0.97); -o-transition: all 0.3s cubic-bezier(0.05, 0.05, 0.31, 0.97); -webkit-transition: all 0.3s cubic-bezier(0.05, 0.05, 0.31, 0.97); transition: all 0.3s cubic-bezier(0.05, 0.05, 0.31, 0.97); }
.top-qa-initem-answer { padding: 4vw; font-size: 3.68vw; text-align: justify; text-justify: inter-ideograph; font-feature-settings: "palt"; line-height: 1.6; letter-spacing: 0.04em; background: #f2f2f2; display: none; }
.top-qa-initem-answer p:last-child{margin-bottom: 0;}
.top-qa-initem-answer a{display: inline-block;text-decoration: underline;color: var(--orange);}



/* =============================================
pc
================================================*/
@media screen and (min-width: 736px) {



.top-qa { padding-bottom: 80px; }
.top-qa-content { width: 510px; }
.top-qa-tab-items { margin-bottom: 30px; border-width: 4px; }
.top-qa-tab-item { padding: 18px 0; font-size: 25px; -moz-border-radius: 10px 10px 0 0; -webkit-border-radius: 10px; border-radius: 10px 10px 0 0; cursor: pointer; }
.top-qa-items { margin-bottom: 30px; }
.top-qa-initem { margin-bottom: 20px; }
.top-qa-initem-question { padding: 20px 60px 20px 60px; font-size: 22px; cursor: pointer; }
.top-qa-initem-question:before { font-size: 26px; letter-spacing: 4px; top: 14px; left: 20px; }
.top-qa-initem-question .plus { width: 24px; height: 24px; right: 20px; }
.top-qa-initem-answer { padding: 25px 30px; font-size: 20px; }




}
