@import "reset.css";
@import "desktop.css";
@import "mobile.css";
@import "slideNav.css";

html,body{
    width:100%;
    display: flex;
    justify-content: center;
    position:relative;
    font-size:15px;
}
a{
    text-decoration: none;  
    color: #666666;
    display: block;
}
a.current_page{
    text-decoration: underline;
}
hr{border: solid 1px #dddddd;}

/* margin */
.mt5{margin-top:5px;}
.mt10{margin-top:10px;}
.mt15{margin-top:15px;}
.mt30{margin-top:30px;}
.mt50{margin-top:50px;}
.mt100{margin-top:100px;}
.mb15{margin-bottom:15px;}
.mb30{margin-bottom:30px;}
.mb50{margin-bottom:50px;}

/* padding */
.pb30{padding-bottom:30px}
.pt30{padding-top:30px !important;}
.pt50{padding-top:50px !important;}

.wrap {
    width:100%;
    position:relative;
    overflow: hidden;
}
header{
    position:fixed;
    top:0; left:0;
    width:100%;
    z-index: 200;
}
/* section */
.section2 {margin:50px 0;}
.section2 > h3 {
    margin: 15px 0;
}
.section2 > .main_sentence {
    color: #999;
}
.section2 > .main_sentence:after { 
    content: '';
    width: 1100px;
    height: 1px;
    display:block;
    margin: 30px 0;
    background-color: #ebebeb;
}
.section3 .img-wrapper {
    position: absolute;
    background-color: white;
}
.section3 .img-wrapper1 {
    animation : fadeout 8s infinite
}
.section3 .img-wrapper2 {
    animation : fadein 8s infinite
}

/* img animation */
@keyframes fadein {
    0% {
        opacity : 0;
    }
    50% {
        opacity : 1;
    }

    100% {
        opacity : 0;
    }
}

@keyframes fadeout {
    0% {
        opacity : 1;
    }
    50% {
        opacity : 0;
    }

    100% {
        opacity : 1;
    }
}


.btn-section > a {
    border : 1px solid #ebebeb;
    display:flex;
    justify-content: center;
    padding: 25px;
}
.btn-section i {
    font-size: 1.3rem; 
    margin-right:10px;
}
.btn-section .description {
    margin: 20px 0;
    display:block;
}

/*footer*/
.footer_section {
    width: 1100px;
    padding: 58px 0;
    margin: 0 auto;
}
.footer_section > ul {
    display:flex;
}

.footer_section > ul > li::after {
    content : "|";
    padding: 0 10px;
    color: #444444;
}