.ads_wrap {margin-top: 6rem;}

.head {background: linear-gradient(90deg, #ea5d2c, #e61c9d); padding: 5rem 0;}
.head * {color:#fff; text-align: center;}
.head h2 {font-size:2.5rem; font-weight: bold;  margin-top: 6rem;}
.head p {font-size:1.7rem; margin-top: 0.8rem;}

.key_wrap {}
.key_wrap .title_wrap {background: #e97600; display:flex; justify-content: center; padding-top: 0.5rem;}
.key_wrap .title_wrap .os {display:flex; width: 48.5%; align-items:center; justify-content: center; padding: 0.5rem 0;}
.key_wrap .title_wrap .os.act {background: #fff; border-radius: 0.5rem 0.5rem 0 0}
.key_wrap .title_wrap .os span {font-size:1.4rem; color:#fff}
.key_wrap .title_wrap .os.act span {color:#333;}
.key_wrap .title_wrap .os img {height: auto; width: 14%; margin-left: 0.5rem; filter:brightness(10)}
.key_wrap .title_wrap .os.act img {filter:unset;}

#key_cont {}
#key_cont ul {}
#key_cont ul .search {padding: 2rem 1.5rem 1rem; border-bottom: 1px solid #ddd;}
#key_cont ul .search h3 {font-size:2rem; font-weight: bold;}
#key_cont ul .search form {margin-top: 1rem;}
#key_cont ul .search form label {border: 1px solid #ddd; border-radius:5rem; width: 100%; display: flex;}
#key_cont ul .search form label input {height: 3rem; line-height: 3rem; font-size:1.4rem; border: 0; background: none; outline:none}
#key_cont ul .search form label input[type="text"] {text-indent: 1.5rem;width: 85%;}
#key_cont ul .search form label input[type="submit"] {width: 15%; text-indent: -9999px; background: url(../sub/search.png) no-repeat center / 40%;}
#key_cont ul > li {display:flex; flex-flow:column;}
#key_cont ul > li > div {border-bottom: 1px solid #ddd;}
#key_cont ul > li > div .title {font-size:2rem; font-weight: bold; padding: 1.3rem 1.5rem; position: relative; cursor:pointer;}
#key_cont ul > li > div .title::after {content:''; display:block; width: 28px; height: 16px; background: url(../sub/arrow_01.png) no-repeat center / 45%; position: absolute; right: 1.5rem; top:1.3rem}
#key_cont ul > li > div .content_wrap {overflow:hidden; display: none;}
#key_cont ul > li > div .content_wrap.on {display: block;}
#key_cont ul > li > div .content_wrap .content {}
#key_cont ul > li > div .content_wrap .content .sub_title {background: #ddd; font-size:1.6rem; font-weight: bold; text-align: center; padding: 0.5rem 0;}
#key_cont ul > li > div .content_wrap .content .sub_content {}
#key_cont ul > li > div .content_wrap .content .sub_content .list {border-bottom: 1px solid #ddd; padding: 1.5rem 1.5rem 3rem; position: relative; cursor:pointer;}
#key_cont ul > li > div .content_wrap .content .sub_content .list::after {content:''; display: block; width: 32px; height: 14px; background: url(../sub/arrow_03.png) no-repeat center / 40%; position:absolute; left: 50%; margin-left: -14px; bottom:1rem;}
#key_cont ul > li > div .content_wrap .content .sub_content .list:nth-child(odd) {background: #fff8f2;}
#key_cont ul > li > div .content_wrap .content .sub_content .list:nth-child(even) {background: #fff1db;}
#key_cont ul > li > div .content_wrap .content .sub_content .list:last-child {border-bottom: 0;}
#key_cont ul > li > div .content_wrap .content .sub_content .list .function_wrap {display:flex; justify-content:space-between; align-items: center;}
#key_cont ul > li > div .content_wrap .content .sub_content .list .function_wrap > * {font-size:1.8rem}
#key_cont ul > li > div .content_wrap .content .sub_content .list .function_wrap .function {color:#e97600; font-weight: bold;}
#key_cont ul > li > div .content_wrap .content .sub_content .list .function_wrap .key { font-weight: bold; font-size:1.8rem;}
#key_cont ul > li > div .content_wrap .content .sub_content .list .mean {overflow:hidden; margin-top: 1.5rem; flex-flow:column; display: none;}
#key_cont ul > li > div .content_wrap .content .sub_content .list .mean.on {display: flex;}
#key_cont ul > li > div .content_wrap .content .sub_content .list .mean img {}
#key_cont ul > li > div .content_wrap .content .sub_content .list .mean span {font-size:1.4rem; padding-top: 0.5rem; word-break:keep-all; line-height: 1.3;}