@charset "utf-8";
/* color */
.cBlue {color: #016fed !important;}
/* color */

/* subTit */
h5.subTit {font-size: 3rem; font-weight: 700; color: #222222; line-height: 3.4rem; margin-bottom: 3rem;}
.flexTitle h5.subTit {margin-bottom: 0;}

@media screen and (max-width: 1026px) {
    h5.subTit {font-size: 2.6rem; line-height: 3.2rem;}
}
/* subTit */

/* flexTitle */
.flexTitle {display: flex; align-items: center; justify-content: space-between; gap: 1.2rem; flex-wrap: wrap; margin-bottom: 3rem;}
/* flexTitle */

/* btn */
button.btn,
a.btn {position: relative; display: flex; gap: 0.9rem; padding: 1.4rem 2rem; background: #fff; border-radius: 2.5rem; border: 1px solid #dddddd; overflow: hidden;}
a.btn.type2 {border-radius: 0.8rem;}
a.btn::before {content: ''; position: absolute; top: 0; left: 0; width: 0; height: 100%; background: #000; transition: all 0.3s;}
a.btn span {position: relative; display: block; font-size: 2rem; font-weight: 600; color: #222222; padding-right: 2.4rem;}
a.btn.link span::before {content: ''; position: absolute; top: 0.4rem; right: 0; width: 1.4rem; height: 1.4rem; background-image: url('/humanframe/theme/digitalgoods/assets/img/sub/btn_link.png'); background-repeat: no-repeat; background-size: 100%; transition: all 0.3s;}
a.btn:hover {border-color: #000;}
a.btn:hover::before {width: 100%;}
a.btn:hover span {color: #fff;}
a.btn.link:hover span::before {background-image: url('/humanframe/theme/digitalgoods/assets/img/sub/btn_link_on.png');}

@media screen and (max-width: 1026px) {
    a.btn {padding: 1rem 1.6rem;}
    a.btn span {font-size: 1.8rem; padding-right: 2rem;}
    a.btn.link span::before {width: 1.2rem; height: 1.2rem;}
}
/* btn */

/* contList */
.contList>li {position: relative; padding-left: 1.5rem; line-height: 3.4rem; font-size: 2.2rem; color: #222222;}
.contList>li:not(:last-child) {margin-bottom: 1rem;}
.contList>li::before {content: ''; position: absolute; top: 1.2rem; left: 0; width: 0.4rem; height: 0.4rem; background: #000000; border-radius: 50%;}

@media screen and (max-width: 1026px) {
    .contList>li {font-size: 1.8rem; line-height: 2.6rem; padding-left: 1.2rem;}
    .contList>li::before {top: 1rem;}
}
/* contList */

/* borderBx */
.borderBx {padding: 4rem; border: 1px solid #dddddd; border-radius: 1rem;}

@media screen and (max-width: 1026px) {
    .borderBx {padding: 2rem;}
}
/* borderBx */

/* subTxt */
.subTxt {font-size: 2.2rem; color: #222222; letter-spacing: -0.01rem; line-height: 3.4rem; margin-bottom: 8.8rem;}

@media screen and (max-width: 1026px) {
    .subTxt {font-size: 1.8rem; line-height: 2.6rem; margin-bottom: 5rem;}
}
/* subTxt */

/* blueBx */
.blueBx {padding: 3rem; background: #f2f9fd; text-align: center; margin-bottom: 8rem;}
.blueBx p {font-size: 2.4rem; color: #0c4da2; letter-spacing: -0.01rem; line-height: 3.4rem;}

@media screen and (max-width: 1026px) {
    .blueBx {padding: 2.5rem; margin-bottom: 5rem;}
    .blueBx p {font-size: 2rem; line-height: 3rem;} 
}
/* blueBx */