@charset "UTF-8";

@media screen and (min-width: 768px),print {

#faq .onecol-contents{max-width: 1043px;padding-top: 120px;}

#contentshistory {margin: 0 auto 53px;position: relative;}
#contentshistory .inner-Box { margin: 0 auto; position: relative; }
#contentshistory .inner-Box ul.his-list {display: -webkit-box;display: -moz-flex;display: -ms-flex;display: -o-flex;display: -ms-flexbox;display: flex;-webkit-box-lines: multiple;-moz-box-lines: multiple;-ms-flex-wrap: wrap;flex-wrap: wrap;margin-bottom: 51px;}
#contentshistory .inner-Box ul.his-list li { position: relative; }
#contentshistory .inner-Box ul.his-list li:nth-child(3n) { margin-right: 0px; }
#contentshistory .inner-Box ul.his-list li a {display: inline-block;border: 1px solid #D2D2D2;border-radius: 30px;background: #F3F5FA;position: relative;padding: 10px 32px 10px 24px;margin-right: 6px;transition: all 0.3s ease-in-out;}
#contentshistory .inner-Box ul.his-list li a:hover { background: #fff; }
#contentshistory .inner-Box ul.his-list li a .arr {position: absolute;top: -9px;right: -14px;transition: all 0.3s ease-in-out;}
#contentshistory .inner-Box ul.his-list li a:hover .arr { top: -5px;}
#contentshistory .inner-Box p.listtext {font-size: 1.3rem;line-height: 1.8;font-weight: 400;letter-spacing: 0.08rem;position: relative;}

#contentsqa h2{border-bottom: #D2D2D2 1px solid;color: #0057AA;font-size: 2.8rem;font-weight: bold;padding-bottom: 13px;margin-bottom: 46px;}
#contentsqa .accordion {margin: 3em auto; max-width: 60vw; }
#contentsqa .toggle {display: none; }
#contentsqa .option {position: relative;margin-bottom: 24px;background: #F3F5FA;border-radius: 16px;padding-bottom: 8px;}
#contentsqa .title, .content {-webkit-backface-visibility: hidden; backface-visibility: hidden; transform: translateZ(0); transition: all 0.3s; }
#contentsqa .title {padding: 20px 40px 12px 70px;display: block;color: #333;font-weight: bold;position: relative;font-size: 1.8rem;}
#contentsqa .title::before{content: "";display: block;width: 13px;height: 13px;position: absolute;right: 1.55em;top: 1.65em;transform: rotate(90deg) !important;background: url(../images/common/arr.svg)no-repeat top left;transition: all 0.3s;cursor: pointer;}
#contentsqa .content {max-height: 0; overflow: hidden; }
#contentsqa .content p {margin: 0;padding: 0.5em 4.8em 1em;font-size: 0.9em;line-height: 1.5;}
#contentsqa .toggle:checked + .title + .content {max-height: 500px; transition: all 1.5s; }
#contentsqa .toggle:checked + .title::before {transform: rotate(270deg) !important;}
#contentsqa .option .qicon{display: block;width: 30px;height: 30px;background: #0057AA;border-radius: 50%;color: #fff;font-size: 1.4rem;font-weight: 700;text-align: center;position: absolute;top: 17px;left: 23px;padding-top: 3px;}
#contentsqa .option .aicon{display: block;width: 30px;height: 30px;border: #0057AA 1px solid;background: #fff;border-radius: 50%;color: #0057AA;font-size: 1.4rem;font-weight: 700;text-align: center;position: absolute;top: 2px;left: 23px;padding-top: 3px;}

#contentsqa{margin-bottom: 16rem;}
#contentsqa .inner-Box{margin-bottom: 90px;}

}

@media screen and (min-width:768px) and ( max-width:1300px) {
.contentsbox .side-nav{ margin-right: 50px; width: 280px; }
}

@media screen and (max-width: 767px) {

.side-nav{ display: none;}

.contentsall{margin: 0 6.4vw;}

#contentshistory {margin: 0 auto 10vw;position: relative;}
#contentshistory .inner-Box {position: relative;padding-top: 6.6vw;}
#contentshistory .inner-Box ul.his-list {display: -webkit-box;display: -moz-flex;display: -ms-flex;display: -o-flex;display: -ms-flexbox;display: flex;-webkit-box-lines: multiple;-moz-box-lines: multiple;-ms-flex-wrap: wrap;flex-wrap: wrap;margin-bottom: 7.4vw;}
#contentshistory .inner-Box ul.his-list li { position: relative; }
#contentshistory .inner-Box ul.his-list li:nth-child(3n) { margin-right: 0.0vw; }
#contentshistory .inner-Box ul.his-list li a {display: inline-block;border: 0.27vw solid #D2D2D2;border-radius: 8.0vw;background: #F3F5FA;position: relative;padding: 0.97vw 7.83vw 0.97vw 4.2vw;margin-right: 1.27vw;transition: all 0.3s ease-in-out;}
#contentshistory .inner-Box ul.his-list li a:hover { background: #fff; }
#contentshistory .inner-Box ul.his-list li a .arr {position: absolute;top: -1.7vw;right: -3.9vw;transition: all 0.3s ease-in-out;width: 2.4vw;}
#contentshistory .inner-Box ul.his-list li a:hover .arr { top: 0vw;}
#contentshistory .inner-Box p.listtext {font-size: 2.93vw;line-height: 1.8;font-weight: 400;letter-spacing: 0.21vw;position: relative;}


#contentsqa{margin: 0 6.2vw;}
#faq .onecol-contents{padding-top: -0.53vw;}

#contentshistory {margin: 0 2.5vw -5.67vw;position: relative;}
#contentshistory .inner-Box { margin: 0 4vw; position: relative; }
#contentshistory .inner-Box ul.his-list {display: -webkit-box;display: -moz-flex;display: -ms-flex;display: -o-flex;display: -ms-flexbox;display: flex;-webkit-box-lines: multiple;-moz-box-lines: multiple;-ms-flex-wrap: wrap;flex-wrap: wrap;margin-bottom: 13.6vw;}
#contentshistory .inner-Box ul.his-list li { position: relative; }
#contentshistory .inner-Box ul.his-list li:nth-child(3n) { margin-right: 0.0vw; }
#contentshistory .inner-Box ul.his-list li a {display: inline-block;border: 0.27vw solid #D2D2D2;border-radius: 8.0vw;background: #F3F5FA;position: relative;padding: 0.67vw 7.53vw 1.37vw 4vw;margin-right: 1.6vw;transition: all 0.3s ease-in-out;font-size: 2.93vw;}
#contentshistory .inner-Box ul.his-list li a:hover { background: #fff; }
#contentshistory .inner-Box ul.his-list li a .arr {position: absolute;top: -1.5vw;right: -3.6vw;transition: all 0.3s ease-in-out;}
#contentshistory .inner-Box ul.his-list li a:hover .arr { top: 0vw;}
#contentshistory .inner-Box p.listtext {font-size: 2.93vw;line-height: 1.8;font-weight: 400;letter-spacing: 0.21vw;position: relative;}

#contentsqa h2{border-bottom: #D2D2D2 0.27vw solid;color: #0057AA;font-size: 5.33vw;letter-spacing: 0.27vw;font-weight: bold;padding-bottom: 2.47vw;margin-bottom: 6.17vw;}
#contentsqa .accordion {margin: 3em auto; max-width: 60vw; }
#contentsqa .toggle {display: none; }
#contentsqa .option {position: relative;margin-bottom: 4.4vw;background: #F3F5FA;border-radius: 2.27vw;padding-bottom: 2.13vw;}
#contentsqa .title, .content {-webkit-backface-visibility: hidden; backface-visibility: hidden; transform: translateZ(0); transition: all 0.3s; }
#contentsqa .title {padding: 4.13vw 11.67vw 3.2vw 14.17vw;display: block;color: #333;font-weight: bold;position: relative;font-size: 3.73vw;letter-spacing: 0.19vw;}
#contentsqa .title::before{content: "";display: block;width: 3.2vw;height: 3.2vw;position: absolute;right: 6.35vw;top: 6.35vw;transform: rotate(90deg) !important;background: url(../images/common/arr.svg)no-repeat top left;transition: all 0.3s;background-size: 180% auto;}
#contentsqa .content {max-height: 0; overflow: hidden; }
#contentsqa .content p {margin: 0;padding: 0.7vw 8vw 4.2vw 14.1vw;font-size: 3.73vw;line-height: 1.5;letter-spacing: 0.19vw;}
#contentsqa .toggle:checked + .title + .content { max-height: 500vw; transition: all 1.5s; }
#contentsqa .toggle:checked + .title::before {transform: rotate(270deg) !important;}
#contentsqa .option .qicon{display: block;height: 5.5vw;width: 5.5vw;background: #0057AA;border-radius: 50%;color: #fff;font-size: 2.67vw;font-weight: 700;text-align: center;position: absolute;top: 4.53vw;left: 6.53vw;padding-top: 0.4vw;}
#contentsqa .option .aicon{display: block;height: 5.5vw;width: 5.5vw;border: #0057AA 0.27vw solid;background: #fff;border-radius: 50%;color: #0057AA;font-size: 2.53vw;font-weight: 700;text-align: center;position: absolute;top: 0.53vw;left: 6.43vw;padding-top: 0.8vw;}

#contentsqa .inner-Box{margin-bottom: 12.80vw;}



}