#main {
    position:relative;
    min-height: calc(100vh - 10.5rem);
    padding-bottom: 10rem;
    overflow: hidden;
}
#main::before {
    content:"";
    position:absolute;
    top:10%;
    left:-6rem;
    width:33.2rem;
    height:30rem;
    background:url("../img/log-bg-left.svg") no-repeat center center;
    background-size: contain;
    z-index:0;
}
#main::after {
    content:"";
    position:absolute;
    top:20%;
    right:-4rem;
    width:27.4rem;
    height:30rem;
    background:url("../img/log-bg-right.svg") no-repeat center center;
    background-size: contain;
    z-index:0;
}


/* main-top */
.main-top {
    padding: 0 var(--home-padding);
}

.visual-news-wrap {
    display: flex;
    gap: 4rem;
    max-width: 155.2rem;
    margin:0 auto;
    padding-top: 3rem;
}
.visual-news-wrap .visual {
    width: 100%;
    position: relative;
}
.visual-news-wrap .visual .visualSwiper {
    border-radius: 2rem;
    overflow: hidden;
}
.visual-news-wrap .visual .visualSwiper .swiper-slide {
    width: 100%;
    height: 60rem;
}
.visual-news-wrap .visual .visualSwiper .swiper-slide a {
    display: block;
    width: 100%;
    height: 100%;
    position: relative;
}
.visual-news-wrap .visual .visualSwiper .swiper-slide a:focus::after {
    content:"";
    display:block;    
    position:absolute;
    top:0;
    left:0;
    bottom:0;
    right:0;
    border:solid 2px #000;
    border-radius: 2rem;
}
.visual-news-wrap .visual .visualSwiper .swiper-slide span {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}
.visual-news-wrap .visual .visualSwiper .swiper-slide span img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: left;
}
.visual-news-wrap .visual .visualSwiper .swiper-slide span.for-pc {
    display: block;
}
.visual-news-wrap .visual .visualSwiper .swiper-slide span.for-mobile {
    display: none;
}


.visual-news-wrap .visual .pager {
    position:absolute;
    left:4rem;
    bottom:4rem;
    z-index:101;
    width:max-content;
    background:#fff;
    border-radius:100vh;
    display:flex;
    align-items:center;
    padding:1.1rem 1rem;
    box-shadow:0 0.4rem 1.3rem rgba(0, 0, 0, 0.13);
}
.visual-news-wrap .visual .pager span {
    display: inline-block;
    width: 0.6rem;
    height: 0.6rem;
    background: #aaa;
    border-radius: 100vh;
    opacity: 0.3;
}
.visual-news-wrap .visual .pager span.on {
    width:3rem;
    background: var(--ccolor);
    opacity: 1;
}

/* control */
.visual-news-wrap .control {
    position:absolute;
    bottom:4rem;
    right:4rem;
    z-index:101;
    display:flex;
    align-items:center;
    gap:1rem;
    background:#fff;
    border-radius:100vh;
    padding:0.5rem 1rem;
    box-shadow:0 0.4rem 1.3rem rgba(0, 0, 0, 0.13);
}
.visual-news-wrap .control button {
    display:block;
    font-size:0;
    width:1.8rem;
    height:1.8rem;
    background-size:contain;
    background-repeat:no-repeat;
    background-position:center;
}
.visual-news-wrap .control button.prev {
    background-image:url("../img/vs-prev.svg");
}
.visual-news-wrap .control button.next {
    background-image:url("../img/vs-next.svg");
}
.visual-news-wrap .control button.pause {
    background-image:url("../img/vs-pause.svg");
}
.visual-news-wrap .control button.play {
    display:none;
    background-image:url("../img/vs-play.svg");
}

@media (max-width:980px){
    .visual-news-wrap .visual .visualSwiper .swiper-slide {
        height: auto;
    }
    .visual-news-wrap .visual .visualSwiper .swiper-slide span.for-pc {
        display: none;
    }
    .visual-news-wrap .visual .visualSwiper .swiper-slide span.for-mobile {
        display: block;
    }
    .visual-news-wrap .visual .visualSwiper .swiper-slide span {
        position: relative;
        top: auto;
        left: auto;
        width: 100%;
        height: auto;
    }
    .visual-news-wrap .visual .visualSwiper .swiper-slide span img {
        width: 100%;
        height: auto;
        object-fit: inherit;
        object-position: inherit;
    }
}

@media (max-width:640px){
    
}
@media (max-width:520px){

}
@media (max-width:420px){

}


/* main-content */
#main .main-content {
    padding: 0 var(--home-padding);
}



#main .inner {
    max-width: 155.2rem;
    margin:0 auto;
}

#main .msec1 {
    margin-top: 10rem;
}
#main .msec1 .eng-heading {
    font-size: 3.6rem;
    color: #000;
    font-weight: 600;
    line-height: 1.2;
}

@media (max-width:980px){
    #main .msec1 {
        margin-top: 8rem;
    }
    #main .msec1 .eng-heading {
        font-size: 3.2rem;
    }
}
@media (max-width:640px){
    #main .msec1 {
        margin-top: 6rem;
    }
    #main .msec1 .eng-heading {
        font-size: 2.8rem;
    }
}
@media (max-width:520px){
    #main .msec1 {
        margin-top: 4rem;
    }
    #main .msec1 .eng-heading {
        font-size: 2.4rem;
    }
}





#main .msec1 .eng-content {
    margin-top: 10rem;
}
#main .msec1 .eng-content p {
    margin-top: 4rem;
    font-size: 2.2rem;
    color: #666;
    font-weight: 400;
    line-height: 1.5;
}

@media (max-width:980px){
    #main .msec1 .eng-content {
        margin-top: 8rem;
    }
    #main .msec1 .eng-content p {
        margin-top: 3rem;
        font-size: 2rem;
    }
}
@media (max-width:640px){
    #main .msec1 .eng-content {
        margin-top: 6rem;
    }
    #main .msec1 .eng-content p {
        margin-top: 2rem;
        font-size: 1.8rem;
    }
}
@media (max-width:520px){
    #main .msec1 .eng-content {
        margin-top: 4rem;
    }
    #main .msec1 .eng-content p {
        font-size: 1.6rem;
    }
}





#main .msec1 .eng-footer {
   
}
#main .msec1 .eng-footer p {
    margin-top: 4rem;
    font-size: 2.2rem;
    color: #000;
    font-weight: 400;
    line-height: 1.5;
}

@media (max-width:980px){
    #main .msec1 .eng-footer p {
        margin-top: 3rem;
        font-size: 2rem;
    }
}
@media (max-width:640px){
    #main .msec1 .eng-footer p {
        margin-top: 2rem;
        font-size: 1.8rem;
    }
}
@media (max-width:520px){
    #main .msec1 .eng-footer p {
        font-size: 1.6rem;
    }
}







#main .msec4 {
    margin-top: 10rem;
}
#main .msec4 p {
    font-size: 3.4rem;
    color: #000;
    font-weight: 600;
    line-height: 1.5;
}

@media (max-width:980px){
    #main .msec4 {
        margin-top: 8rem;
    }
    #main .msec4 p {
        font-size: 2.8rem;
    }
}
@media (max-width:640px){
    #main .msec4 {
        margin-top: 6rem;
    }
    #main .msec4 p {
        font-size: 2.4rem;
    }
}
@media (max-width:520px){
    #main .msec4 {
        margin-top: 4rem;
    }
    #main .msec4 p {
        font-size: 2rem;
    }
}






#main .msec5 {
    margin-top: 5rem;
    background-color: #fbfbfb;
    padding: 10rem var(--home-padding);
}
#main .msec5 .inner {
    display: flex;
}

#main .msec5 h2.mtit {
    font-size: 3.6rem;
    color: #000;
    font-weight: 600;
    line-height: 1.1;
}

#main .msec5 .inner .left {
    width: 20%;
}
#main .msec5 .inner .right {
    width: 80%;
}
#main .msec5 .inner .right h3 {
    font-size: 3.6rem;
    color: #000;
    font-weight: 600;
    line-height: 1.2;
}
#main .msec5 .inner .right ul {
    margin-top: 5rem;
    display: flex;
    margin-left:-2%;
}
#main .msec5 .inner .right ul li {
    display: flex;
    flex-direction: column;
    width: calc(33.3333% - 2%);
    margin-left:2%;
    gap: 2rem;
}
#main .msec5 .inner .right ul li .thumb {
    position: relative;
}
#main .msec5 .inner .right ul li .thumb img {
    max-width: 100%;
}
#main .msec5 .inner .right ul li .info {

}
#main .msec5 .inner .right ul li .info p {
    font-size: 2rem;
    color: #666;
    font-weight: 400;
    line-height: 1.5;
}

#main .msec5 .inner .right .nt {
    margin-top: 5rem;
    border-top: solid 1px #e5e5e5;
    padding-top: 2rem;
}
#main .msec5 .inner .right .nt p {
    font-size: 1.8rem;
    color: #666;
}
#main .msec5 .inner .right .nt p span {
    color: #008a3d;
}

#main .msec5 .inner .right .btn-wrap {
    margin-top: 5rem;
    text-align: center;
}
#main .msec5 .inner .right .btn-wrap a {
    display: inline-block;
    padding:2.5rem 3rem;
    border-radius: 1.2rem;
    background:#008a3d;
    font-size: 2rem;
    color:#fff;
    font-weight: 600;
    text-align: center;
    text-decoration: none;
    transition: all 0.3s ease;
}


@media (max-width:980px){
    #main .msec5 {
        padding: 8rem var(--home-padding);
    }
    #main .msec5 h2.mtit {
        font-size: 3.2rem;
    }
    #main .msec5 .inner {
        flex-direction: column;
        gap: 4rem;
    }
    #main .msec5 .inner .left {
        width: 100%;
    }
    #main .msec5 .inner .right {
        width: 100%;
    }
    #main .msec5 .inner .right h3 {
        font-size: 3.2rem;
    }
    #main .msec5 .inner .right ul li .info p {
        font-size: 1.8rem;
    }
    #main .msec5 .inner .right .btn-wrap a {
        font-size: 1.8rem;
    }
}
@media (max-width:640px){
    #main .msec5 {
        padding: 6rem var(--home-padding);
    }
    #main .msec5 h2.mtit {
        font-size: 2.6rem;
    }
    #main .msec5 .inner .right h3 {
        font-size: 2.8rem;
    }
    #main .msec5 .inner .right ul {
        margin-left:0;
        flex-direction: column;
        gap: 4rem;
    }
    #main .msec5 .inner .right ul li {
        width: 100%;
        margin-left:0;
    }
    #main .msec5 .inner .right ul li .thumb img {
        width: 100%;
    }
    #main .msec5 .inner .right .btn-wrap a {
        font-size: 1.6rem;
    }
}
@media (max-width:520px){
    #main .msec5 {
        padding: 4rem var(--home-padding);
    }
    #main .msec5 {
        margin-top: 4rem;
    }
    #main .msec5 h2.mtit {
        font-size: 2rem;
    }
    #main .msec5 .inner .right h3 {
        font-size: 2.4rem;
    }
}








#main .msec6 {
    margin-top: 10rem;
    padding: 0 var(--home-padding);
}
#main .msec6 .inner {
    display: flex;
}

#main .msec6 h2.mtit {
    font-size: 3.2rem;
    color: #000;
    font-weight: 600;
    line-height: 1.1;
}

#main .msec6 .inner .left {
    width: 20%;
    padding-right: 2rem;
}
#main .msec6 .inner .right {
    width: 80%;
}


#main .msec6 .inner .right ul {

}
#main .msec6 .inner .right ul li {
    display: flex;
}
#main .msec6 .inner .right ul li:nth-child(even) {
    text-align: left;
}
#main .msec6 .inner .right ul li:nth-child(odd) {
    text-align: right;
}
#main .msec6 .inner .right ul li dl {
    width: 50%;
    display: flex;
    flex-direction: column;
    gap: 2rem;
}
#main .msec6 .inner .right ul li dl:first-child {
    padding-right: 5rem;
}
#main .msec6 .inner .right ul li dl:last-child {
    border-left: solid 1px #d9d9d9;
    padding-left: 5rem;
}
#main .msec6 .inner .right ul li dl.in {
    padding-top: 5rem;
}

#main .msec6 .inner .right ul li dl dt {
    font-size: 2.4rem;
    color: #000;
    font-weight: 600;
    line-height: 1.2;
}
#main .msec6 .inner .right ul li dl.in dt {
    position: relative;
}
#main .msec6 .inner .right ul li dl.in dt::before {
    content: "";
    display: block;
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    width: 3rem;
    height: 1px;
    border-top: solid 1px var(--ccolor);
}
#main .msec6 .inner .right ul li dl.in dt::after {
    content: "";
    display: block;
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    width: 7px;
    height: 7px;
    border-radius: 100%;
    background: var(--ccolor);
}
#main .msec6 .inner .right ul li:nth-child(even) dl.in dt::before {
    left: -5rem;
}
#main .msec6 .inner .right ul li:nth-child(even) dl.in dt::after {
    left: -2rem;
}
#main .msec6 .inner .right ul li:nth-child(odd) dl.in dt::before {
    right: -5rem;
}
#main .msec6 .inner .right ul li:nth-child(odd) dl.in dt::after {
    right: -2rem;
}
#main .msec6 .inner .right ul li dl dd {
    display: flex;
    flex-direction: column;
    gap: 2rem;
}
#main .msec6 .inner .right ul li dl dd p {
    font-size: 1.8rem;
    color: #666;
    font-weight: 400;
    line-height: 1.4;
}
#main .msec6 .inner .right ul li dl dd .img {
    display: flex;
    margin-left: -2%;
}
#main .msec6 .inner .right ul li dl dd .img span {
    width: calc(50% - 2%);
    margin-left: 2%;
}
#main .msec6 .inner .right ul li dl dd .img span img {
    width: 100%;
}
#main .msec6 .inner .right ul li dl dd .subject {
    font-size: 1.8rem;
    font-weight: 500;
    color: #000;
    line-height: 1.4;
}





@media (max-width:980px){
    #main .msec6 {
        margin-top: 8rem;
    }
    #main .msec6 h2.mtit {
        font-size: 3.2rem;
    }
    #main .msec6 .inner {
        flex-direction: column;
        gap: 4rem;
    }
    #main .msec6 .inner .left {
        width: 100%;
    }
    #main .msec6 .inner .right {
        width: 100%;
    }
    #main .msec6 .inner .right ul li dl dt {
        font-size: 2.4rem;
    }
    #main .msec6 .inner .right ul li dl dd p {
        font-size: 1.8rem;
    }
    #main .msec6 .inner .right ul li dl dd .subject {
        font-size: 1.6rem;
    }
}
@media (max-width:640px){
    #main .msec6 {
        margin-top: 6rem;
    }
    #main .msec6 h2.mtit {
        font-size: 2.6rem;
    }
    #main .msec6 .inner .right ul li dl dt {
        font-size: 2.4rem;
    }
    #main .msec6 .inner .right ul li:nth-child(odd) {
        text-align: left;
    }
    #main .msec6 .inner .right ul li dl.blank {
        display: none;
    }
    #main .msec6 .inner .right ul li dl.in {
        width: 100%;
        border-left: solid 1px #d9d9d9;
        padding-left: 5rem;
    }
    #main .msec6 .inner .right ul li:nth-child(odd) dl.in dt::before {
        right: auto;
        left: -5rem;
    }
    #main .msec6 .inner .right ul li:nth-child(odd) dl.in dt::after {
        right: auto;
        left: -2rem;
    }
}
@media (max-width:520px){
    #main .msec6 {
        margin-top: 4rem;
    }
    #main .msec6 h2.mtit {
        font-size: 2rem;
    }
    #main .msec6 .inner .right ul li dl dt {
        font-size: 2rem;
    }
}