@charset "UTF-8";

/* ----------------------------------
 FAQ
---------------------------------- */
.pane-contents { max-width: 1200px; margin: 0 auto;}
.faq-title { margin: 0 0 40px 0; text-align: center;}
.faq-title h1.eng { padding: 0; margin: 30px 0 10px; font-family: "roc-grotesk", sans-serif; font-size: 54px; font-weight: 800; text-align: center; line-height: 1.0; color: #0047BA;}
.faq-title p.jpn  { font-size: 20px; font-weight: 600; text-align: center; line-height: 1.0;}

#faq_search_box { margin: 0 0 40px 0;}
#faq_search_box form { width: 710px; margin: 0 auto; display: flex; justify-content: space-between; align-items: center;}
#faq_search_box form input[type="text"] { width: 600px; height: 45px; padding: 0 15px 0 40px; border: #DFE4E6 1px solid; border-radius: 45px; outline: none; font-size: 14px; font-weight: 600; background: #fff url("../../../img/usr/common/icon/ico_search_gray.png") 10px center no-repeat; -webkit-background-size: 18px 18px; background-size: 18px 18px;}
#faq_search_box form input[type="submit"] { width: 100px; height: 45px; border: #0047BA 2px solid; border-radius: 45px; outline: none; font-size: 14px; font-weight: 600; color: #0047BA; display: flex; justify-content: center; align-items: center; background: #fff;}

.faq-data-total { margin: 0 0 20px 0; font-size: 14px; text-align: center;}
.faq-data-total .num { margin: 0 3px; font-size: 18px; font-weight: 600;}

.faq-contents-item { border-top: #DFE4E6 1px solid; border-bottom: #DFE4E6 1px solid;}
.faq-contents-item + .faq-contents-item { border-top: none;}
.faq-contents-item strong { font-weight: bold;}
.faq-contents-item .faq-box .mark { width: 56px; height: 56px; font-size: 28px; font-weight: 600; line-height: 1.0; color: #0047BA; display: flex; justify-content: center; align-items: center; position: absolute; top: 0; left: 0;}
.faq-contents-item .faq-box .q { min-height: 56px; padding: 10px 56px 10px 56px; font-size: 16px; font-weight: 600; display: flex; align-items: center; position: relative;}
.faq-contents-item .faq-box .q::after { content: ""; width: 8px; height: 8px; margin: 0 0 0 5px; border-right: 1px solid #9DA3A6; border-top: 1px solid #9DA3A6; position: absolute; top: calc(50% - 6px); right: 15px; transform: rotate(135deg); transition: 0.3s;}
.faq-contents-item .faq-box .q.open { background: #F0F5F7;}
.faq-contents-item .faq-box .q.open::after { top: calc(50% - 2px); right: 15px; transform: rotate(-45deg);}
.faq-contents-item .faq-box .a { min-height: 76px; padding: 25px 20px 25px 56px; border-top: #DFE4E6 1px solid; font-size: 16px; line-height: 1.6; position: relative; display: none;}
.faq-contents-item .faq-box .a .mark { height: 76px;}
.faq-contents-item .faq-box .a .text a { text-decoration: underline; transition: 0.3s;}
.faq-contents-item .faq-box .a .text a:hover { text-decoration: none;}
	
#faq_data_tab { border-bottom: #0047BA 2px solid; margin: 0 0 40px 0; display: flex; justify-content: center; gap: 10px;}
#faq_data_tab > div { width: 530px; height: 45px; padding: 2px 0 0 0; border-radius: 5px 5px 0 0; font-size: 18px; font-weight: 600; color: #0047BA; display: flex; justify-content: center; align-items: center; cursor: pointer; background: #F0F5F7; order: 4;}
#faq_data_tab > div#tab_plazapass { order: 3;}
#faq_data_tab > div#tab_online { order: 2;}
#faq_data_tab > div#tab_store { order: 1;}
#faq_data_tab > div.select { color: #fff; background: #0047BA;}
#faq_data_frame { display: flex; justify-content: space-between;}
#faq_data_frame #faq_data_frame_left { width: 280px; padding: 15px; border-radius: 20px; background: #F0F5F7; align-self: flex-start;}
#faq_data_frame #faq_data_frame_left .side-navi a { padding: 12px 0; font-size: 15px; font-weight: 600; text-decoration: none; line-height: 1.2; display: block; position: relative;}
#faq_data_frame #faq_data_frame_left .side-navi a::after { content: ""; width: 8px; height: 8px; margin: 0 0 0 5px; border-right: 1px solid #9DA3A6; border-top: 1px solid #9DA3A6; position: absolute; top: calc(50% - 4px); right: 5px; transform: rotate(45deg);}
#faq_data_frame #faq_data_frame_main { width: 880px;}
#faq_data_frame #faq_data_frame_main .child-group { margin: 0 0 40px 0;}
#faq_data_frame #faq_data_frame_main h2 { padding: 15px 0; margin: 0 0 10px 0; border: none; border-top: #0047BA 2px solid; font-size: 18px; font-weight: 600; color: #0047BA;}