@charset 'UTF-8';
/* FAQ common
   ========================================================================== */

.container a:hover{
   opacity: .7;
}

.container a{
   position: relative;
}
.container a .icon-arrow--right{
   font-size: 12px;
   line-height: normal;
   margin-left: 10px;
}
.container a.text-link--icon .number{
   color: #adadad;
}

.container h1{
   font-size: 28px;
   line-height: 1.2;
   margin-bottom: 60px;
}

/* bold */
.fWB{
   font-weight: bold;
}
/* title */
.glossaryTitle {
    font-weight: 700;
    padding-left: 14px;
    border-left: 4px solid #2076c7;
}
/* same tab */
.basic {
    text-decoration: underline;
    color: #2076c7;
}
/* other tab */
.basic.external{
    text-decoration: underline;
    color: #2076c7;
}
.basic.external::after{
    content: '';
    display: inline-block;
    width: 1.1em;
    height: 1em;
    margin-left: 0.2em;
    margin-right: 0.4em;
    transform: translateY(2px);
}
.basic.external::after{
   background: url(../imgs/icon-newtab-blue.svg) no-repeat center/contain;
}
/* PDFlink */
.link_pdf{
   text-decoration: underline;
   color: #2076c7;
}
.link_pdf::after{
   background: url(../imgs/icon-pdf-blue.svg) no-repeat center/contain;
   content: '';
   display: inline-block;
   width: 1em;
   height: 1em;
   margin-left: 0.2em;
   margin-right: 0.4em;
   transform: translateY(2px);
}
/* gray font color */
.gray{
   color: #666666;
}
/* right justified*/
.common_link{
   margin-top: 8px;
   text-align: right;
}
/* no rank list */
ul li.plz{
   position: relative;
    padding-left: 18px;
    margin-bottom: 14px;
    list-style: none;
}

ul li.plz::before {
   content: "";
   display: block;
   width: 8px;
   height: 8px;
   background: #2076c7;
   border-radius: 50%;
   position: absolute;
   left: 0;
   top: 0.4em;
}
/* with rank */
ol li.hierarchy{
   position: relative;
    padding-left: 18px;
    margin-bottom: 14px;
}

ol li.hierarchy::before{
   content: counter(custom-counter) ". ";
    font-weight: normal;
    padding-right: 10px;
    position: absolute;
    left: 0;
    top: 0;
}

ul.category_list li{
   display: inline;
}
ul.category_list a.text-link--icon{
   display: inline;
}
.category_list li span.icon-arrow--right{
   padding: 0 9px 0 14px;
   vertical-align: baseline;
}
.icon-arrow--right:before {
   font-size: 12px;
   color: unset;
}

@media screen and (max-width: 1019px)
{
   .container h1{
      margin-bottom: 8vw;
   }
}

.questionBlock h2{
   font-size: 20px;
   line-height: 1.2;
   border-bottom: 2px solid #2076c7;
   margin: 0 0 8px 0;
   padding: 0 0 12px 0;
}

.foot_button .button-group{
   margin-bottom: 20px;
}

.foot_button .button-group .link-icon{
   display: inline-block;
   width: 335px;
   padding: 13px 14px 13px 30px;
   text-align: center;
}

.foot_button .button-group .link-icon [class^='icon']{
   right: auto;
   left: 13px;
}

#faqranking{
   display: flex;
   justify-content: space-between;
   width: 100%;
}

#faqranking .ranking_block{
   width: calc(100% - 280px);
   margin: 0 0 45px 0;
}

.question_list{

}

.question_list li{
   padding: 15px 0;
   border-bottom: 1px solid #dbe3e8;
}

.question_list li a{
   display: block;
   font-size: 14px;
   line-height: 1.5;
   min-height: 29px;
   padding: 4px 40px 4px 50px;
   background-image: url(../imgs/icon-faq-question.svg);
   background-repeat: no-repeat;
   background-position: 0 0;
   background-size: 29px 29px;
   position: relative;
}

.question_list.category li a{
   padding: 4px 40px 4px 10px;
   background-image: none;
   color: #2076c7;
}

.question_list.category li a span.number{
   color: #adadad;
}

.question_list li a .icon-arrow--right{
   position: absolute;
   top: 0;
   right: 10px;
   display: flex;
   height: 100%;
   align-items: center;
   margin-left: 0;
}

.keywords_block li{
   padding: 7px 0;
}

.keywords_block li a{
   display: block;
   font-size: 16px;
   line-height: 1.5;
   min-height: 30px;
   display: flex;
   align-items: center;
}
.keywords_block li a .icon-number{
   min-width: 30px;
   margin: 0 10px 0 0;
}

#faqranking .keywords_block{
   width: 240px;
   margin: 0 0 45px 0;
}

#category{
   margin: 0 0 60px 0;
}

#category .column{
   margin: 0;
}
#category .column > [class^='column__']{
   padding: 10px 10px 20px 0;
}
#category .column > [class^='column__'] + [class^='column__']{
   padding: 10px 0 20px 10px;
}
#category .accordion__item .accordion__label{
   border-top: none;
   border-bottom: 1px solid #dbe3e8;
}
#category .category_list{
   padding-top: 40px;
}
#category .category_list li{
   padding: 0 0 20px 0;
   display: block;
}
#category .category_list li a{
   display: flex;
   align-items: center;
}
#category .category_list li a .icon-arrow--right{
   margin-top: 0;
   padding-left: 0;
}

#questionsort .search__box .column{
   margin-bottom: 10px;
}
#questionsort .search__box .column + p{
   margin-bottom: 30px;
   color: #555555;
}
#questionsort .form-group .form-radio{
   margin-bottom: 10px;
}

#questionsort .search__box .column .searchBox{
   width: 100%;
   margin-right: 0;
}

#questionsort .accordion__item .accordion__label{
   border: none;
   background-color: #2076c7;
   color: #fff;
   font-weight: normal;
   line-height: 1;
   padding: 14px 15px;
   min-height: 40px;
}
#questionsort .accordion__item .accordion__body{
   padding: 20px;
   background-color: #fff;
}
#questionsort .accordion__item.show .accordion__label [class^='icon']::before,
#questionsort .icon-plus:before{
   color: #fff;
}
#questionsort ul.accordion{
   margin-bottom: 30px;
}

.btn-close{
   margin-top: 60px;
}




@media (min-width: 1020px) and (max-width: 1199px)
{

}


@media screen and (max-width: 1019px)
{
   .question_list li a{
      background-position: 0 center;
   }
   #faqranking{
      display: block;
   }
   #faqranking .ranking_block{
      width: 100%;
   }
   #faqranking .keywords_block{
      width: 100%;
   }
   #category .column > [class^='column__']{
      padding-right: 0;
   }
   #category .column > [class^='column__'] + [class^='column__']{
      padding-left: 0;
   }
   #category .accordion__item .accordion__label{
      padding-left: 0;
   }
   #questionsort .search__box{
      width: 100vw;
      margin: 0 calc(50% - 50vw);
   }

}




/* FAQ category
   ========================================================================== */

#tpl_category #questionsort{
   margin-bottom: 60px;
}

#tpl_category #faqranking{
   display: block;
   margin-bottom: 80px;
}

#tpl_category #faqranking .ranking_block{
   width: 100%;
   margin-bottom: 30px;
}

#tpl_category #faqranking .column-pagination{
   align-items: center;
}

#tpl_category #faqranking .pagination{
   justify-content: flex-end;
}

#tpl_category .question_list.result_list li a{
   display: block;
   font-size: 14px;
   line-height: 1.5;
   min-height: auto;
   padding: 0;
   background: none;
}

#tpl_category .question_list.result_list li a .resulut_q{
   min-height: 29px;
   padding: 4px 40px 4px 50px;
   background-image: url(../imgs/icon-faq-question.svg);
   background-repeat: no-repeat;
   background-position: 0 0;
   background-size: 29px 29px;
   position: relative;
   color: #2076c7;
   font-weight: bold;
}

#tpl_category .question_list.result_list li a .resulut_a{
   min-height: 29px;
   margin-top: 15px;
   padding: 4px 40px 4px 50px;
   background-image: url(../imgs/icon-faq-answer.svg);
   background-repeat: no-repeat;
   background-position: 0 0;
   background-size: 29px 29px;
   position: relative;
}

#tpl_category .block-topic.noresult{
   margin-top: 20px;
   padding: 26px 30px;
}

#tpl_category .highlight{
   padding: 3px;
   background-color: #ffff66;
}

@media screen and (max-width: 1019px)
{
   #tpl_category #faqranking .pagination{
      justify-content: space-between;
   }
   
   #tpl_category .block-topic.noresult{
      margin-top: 2.66vw;
      padding: 3.46vw 4vw;
   }

}




/* FAQ detail
   ========================================================================== */

   #tpl_detail .search_wrap{
      display: flex;
      justify-content: space-between;
      align-items: center;
      margin-bottom: 60px;
   }
   #tpl_detail .search_wrap h1{
      margin-bottom: 0;
   }
   #tpl_detail .search__box.head_search{
      width: 400px;
      padding: 0;
      background-color: #fff;
   }
   #tpl_detail .search__box.head_search .column{
      display: block;
      margin: 0;
   }
   #tpl_detail .search__box.head_search .column .search__box--left{
      width: auto;
      margin: 0;
   }
   #tpl_detail .search__box.head_search .column .search__box--left .input-search-box{
      border: 1px solid #dbe3e8;
   }

   #tpl_detail .detail_block{
      margin-bottom: 40px;
   }
   #tpl_detail .detail_block h2{
      margin-bottom: 20px;
   }
   #tpl_detail .detail_block .resulut_q{
   min-height: 29px;
   padding: 4px 0 15px 50px;
   background-image: url(../imgs/icon-faq-question.svg);
   background-repeat: no-repeat;
   background-position: 0 0;
   background-size: 29px 29px;
   position: relative;
   color: #222;
   font-weight: bold;
   border-bottom: 1px solid #dbe3e8;
}

#tpl_detail .detail_block .resulut_a{
   min-height: 29px;
   margin-top: 15px;
   padding: 4px 0 4px 50px;
   background-image: url(../imgs/icon-faq-answer.svg);
   background-repeat: no-repeat;
   background-position: 0 0;
   background-size: 29px 29px;
   position: relative;
}

#tpl_detail .related_question{
   margin-top: 60px;
}


#tpl_detail .info{
   margin: 50px 0 60px 0;
}

#tpl_detail .questionnaire{
   width: 920px;
   margin: 0 auto 80px;
}

#tpl_detail .questionnaire .evaluation{
   margin: 30px 0;
}

#tpl_detail .questionnaire .evaluation .text-center + .text-center{
   margin-top: 20px;
}
#tpl_detail .questionnaire .evaluation .text-center span{
   font-size: 16px;
   color: #2076c7;
   font-weight: bold;
}

#tpl_detail .questionnaire .evaluation .link-group{
   margin-top: 10px;
}

#tpl_detail .questionnaire .evaluation .link-group a.link-box img.active{
   display: none;
}

#tpl_detail .questionnaire .evaluation .link-group a.link-box.active{
   color: #fff;
   background-color: #2076c7;
}
#tpl_detail .questionnaire .evaluation .link-group a.link-box.active img{
   display: none;
}

#tpl_detail .questionnaire .evaluation .link-group a.link-box.active img.active{
   display: block;
}

#tpl_detail .questionnaire .button-group .link-icon{
   display: inline-block;
   width: 335px;
   text-align: center;
}

#tpl_detail .questionnaire .search__box{
   padding: 0;
}

#tpl_detail .questionnaire .search__box .column-search{
   display: block;
   margin-top: 20px;
   margin-bottom: 30px;
}

#tpl_detail .questionnaire .search__box .search__box-submit .btn-small.btn--main{
   width: 160px;
   min-height: 40px;
   padding: 0;
   cursor: pointer;
}

#tpl_detail .questionnaire .search__box .search__box-submit .btn-small.btn--main:hover{
   opacity: .7;
}

#tpl_detail .questionnaire .search__box .column .search__box--left{
   width: 100%;
   margin-right: 0;
}

#tpl_detail .block-arousal-explanation .sub-head{
   margin-bottom: 10px;
}

@media screen and (max-width: 1019px)
{
   #tpl_detail .search_wrap{
      display: block;
      margin-bottom: 13.33vw;
   }
   #tpl_detail .search_wrap h1{
      margin-bottom: 8vw;
   }
   #tpl_detail .search__box.head_search{
      width: auto;
   }
   #tpl_detail .questionnaire{
      width: auto;
   }
   #tpl_detail .questionnaire .conversion{
      width: 100vw;
      margin-right: -20px;
      margin-left: -20px;
   }

   
}









/* English
   ========================================================================== */

.wrapper.english #faqranking{
   display: block;
}

.wrapper.english #faqranking .ranking_block{
   width: 100%;
   margin: 0 0 45px 0;
}

.english #questionsort .search__box{
   flex-direction: inherit;
   margin-top: 30px;
}

.english #questionsort .search__box .column{
   width: 100%;
   margin-right: 30px;
}

.english #questionsort .search__box .column.search__box-submit{
   width: 160px;
   margin-right: 0;
}

.english #questionsort .search__box .column input.btn-search-box[type='image']{
   left: 10px;
   right: auto;
}

.english #questionsort .search__box .column .search__box--left .input-search-box{
   padding-left: 35px;
}

.english #tpl_detail .questionnaire .h3 span{
   color: #2076c7;
}
.english #tpl_detail .questionnaire .button-group{
   margin-bottom: 0;
}
.english #tpl_detail .questionnaire .btn.btn--main{
   width: 300px;
}

#modal1 .modal__dialog .modal__content{
   height: 150px;
}
#modal2 .modal__dialog .modal__content{
   height: 360px;
}
.modal__content .modal__body .search__box{
   padding: 0;
   background-color: #fff;
}
.modal__content .modal__body .search__box .column{
   display: block;
}
.modal__content .modal__body .search__box .column .search__box--left{
   width: 100%;
}
.modal__content .modal__body .search__box .column .search__box--left .input-search-box{
   height: auto;
   padding: 20px;
   background-color: #f6f8f9;
}

@media screen and (max-width: 1019px)
{
   .english #questionsort .search__box{
      display: block;
   }
   .english #questionsort .search__box .column{
      margin-bottom: 30px;
   }
   .english #questionsort .search__box .column.search__box-submit{
      margin: 0 auto;
   }
   .english #questionsort .search__box .column input.btn-search-box[type='image']{
      left: auto;
      right: 10px;
   }
   
   .english #questionsort .search__box .column .search__box--left .input-search-box{
      padding-left: 15px;
   }
   #modal1 .modal__dialog .modal__content{
      /*height: auto;*/
   }
   #modal2 .modal__dialog .modal__content{
      height: auto;
   }
   
}

   