@font-face{font-family:'Mont ExtraLight';font-style:normal;src:url(/sites/guide/font/Montserrat-ExtraLight.woff2) format("woff2"),url(../../font/Montserrat-ExtraLight.woff) format("woff")}
@font-face{font-family:'Mont Light';font-style:normal;src:url(/sites/guide/font/Montserrat-Light.woff2) format("woff2"),url(../../font/Montserrat-Light.woff) format("woff")}
@font-face{font-family:'Mont Regular';font-style:normal;src:url(/sites/guide/font/Montserrat-Regular.woff2) format("woff2"),url(../../font/Montserrat-Regular.woff) format("woff")}
@font-face{font-family:'Mont Medium';font-style:normal;src:url(/sites/guide/font/Montserrat-Medium.woff2) format("woff2"),url(../../font/Montserrat-Medium.woff) format("woff")}
@font-face{font-family:'Mont SemiBold';font-style:normal;src:url(/sites/guide/font/Montserrat-SemiBold.woff2) format("woff2"),url(../../font/Montserrat-SemiBold.woff) format("woff")}

._fnctWrap{line-height:1.5}

.wrap-contents ._objHtml {margin-top: 0 !important;}
.wrap-history {display: none; position: relative;padding:70px 0;background: #f7f7f7;margin-top:80px;}
.wrap-history:before{content:'';width:300%;height:100%;background:#f7f7f7;position:absolute;left:-100%;top:0;z-index: -1;}
.wrap-history:after{content:'';width:760px;height:516px;background:url('../images/history-bg.png') no-repeat center;position: absolute;left:-140px;top:90px;z-index: 0;}
.wrap-history.active {display: block;}
.wrap-history > strong{font-size: 32px;font-family: 'Noto Regular';display: block;text-align: center;margin-bottom: 85px;position: relative;z-index: 9;}
.wrap-history > strong > span{font-family: 'Noto Bold';}
.wrap-history .line {display: table; width: 100%; margin-bottom: 50px;}
.wrap-history .line:first-child .info {padding-top: 0; background: #fff;}
.wrap-history .year {position: relative; display: table-cell; vertical-align: top; width: 280px;}
.wrap-history .year strong {position: relative; font-family: 'Noto Bold'; font-size: 36px; color: #363636; letter-spacing: 0; line-height: 1;}
.wrap-history .year strong:after {content: ''; position: absolute; left: 0; top: -10px; z-index: 1; width: 10px; height: 10px; border-radius: 100%; background: #fff; border: 3px solid #39c9ff;}
.wrap-history .year strong::before {content: ''; position: absolute; left: 111%; top: 22px; width: 100%; height: 3px; background: #002e66;}
.wrap-history .info {position: relative;display: table-cell;padding-left: 20px;vertical-align: top;}
.wrap-history .detail {display: table;width: 50%;text-align: left;margin-left:auto;padding-bottom: 62px;position: relative;z-index: 99;padding-right: 80px;padding-left: 80px;background: url('../images/his-line-bg.png') no-repeat left top;margin-bottom: 7px;}
.wrap-history .detail:nth-child(even){text-align: right;margin-left: 0;padding-right: 80px;background-position: right top;width: calc(50% + 7px);}
.wrap-history .detail:last-child .desc {padding-bottom: 0;}
.wrap-history .month {display: block; width: 100%;}
.wrap-history .month strong {font-family: 'Noto Bold';font-size: 36px;color: #222;letter-spacing: 0;display: block;margin-bottom: 15px;position: relative;line-height: 1;}
.wrap-history .month strong:before{content:'';width:70px;height: 5px;background: #489aae;position: absolute;top:50%;margin-top: 0;left: -90px;}
.wrap-history .detail:nth-child(even) strong:before{left:unset;right: -90px;}
.wrap-history .desc{display: block; position: relative; margin-bottom: 10px; font-family: 'Noto Light'; font-size: 18px; color: #363636;line-height: 1.7;}
.wrap-history .desc .list {margin-top: 10px; margin-bottom: 10px;}
.wrap-history .desc .list li {position: relative; padding-left: 8px; font-family: 'Noto Light'; font-size: 16px; color: #666; line-height: 1.5;}
.wrap-history .desc .list li:after {content: ''; position: absolute; left: 0; top: 12px; width: 5px; height: 1px; background: #666;}

@media all and (max-width: 860px) {
  .wrap-history{padding-bottom: 30px;}
.wrap-history > strong{font-size: 26px;margin-bottom: 35px;}
.wrap-history .detail{width:100%;padding-left:20px;padding-bottom: 20px;padding-right: 40px;}
.wrap-history .month strong{font-size: 22px;}
.wrap-history .month strong:before{width:20px;left: -25px;}
.wrap-history .desc{font-size:17px;}
.wrap-history .detail:nth-child(even){width:100%;padding-right:40px;text-align: left;background-position: left top;}
.wrap-history .detail:nth-child(even) strong:before{left: -25px;right:unset;}
}

@media all and (max-width: 730px) {
    .wrap-history .year strong::before {display: none;}
    .wrap-history .line {margin-bottom: 40px;}
    .wrap-history .year,
    .wrap-history .info {display: block; width: 100%;}
    .wrap-history .year {margin-bottom: 10px;}
    .wrap-history .info {padding: 0; padding-left: 27px;}
    .wrap-history .info:after {display: none;}
}

@media all and (max-width: 470px) {
    .wrap-history .month,
    .wrap-history .desc {display: block; width: 100%;}
}

.history-title {position: relative; margin-top: 50px; margin-bottom: 50px;}
.history-title .thumb {position: absolute; left: 0; top: -50px; width: 31%;}
.history-title .desc {padding: 5%; vertical-align: top; border: 10px solid #edeff5;}
.history-title .desc strong {position: relative; display: block; padding-bottom: 10px; margin-bottom: 10px;font-family: 'Noto Medium'; font-size: 26px; color: #003893;}
.history-title .desc strong:after {content: ''; position: absolute; left: 0; bottom: 0; width: 35px; height: 1px; background: #0067d4;}
.history-title .desc p {position: relative; padding-bottom: 20px; margin-bottom: 15px; font-family: 'Noto Light'; font-size: 20px; color: #5b5b5b;}
.history-title .desc p:after {content: ''; position: absolute; left: 0; bottom: 0; width: 35px; height: 1px; background: #0067d4;}
.history-title .desc span {font-family: 'Noto Light'; font-size: 18px; color: #5b5b5b;}

@media all and (max-width: 700px) {
    .history-title {margin-top: 0;}
    .history-title .desc strong {font-size: 30px}
    .history-title .thumb {position: static; width: 100%; margin-bottom: 20px; text-align: center;}
    .history-title {padding-left: 0;}
    .history-title .desc {padding: 4.5%;}
    .history-title .desc span {font-size: 16px;}
}
