body,html {height:100%;}

body {position:fixed;overflow-y:scroll;}
body.on {position:relative;overflow-y:auto;}

.wrap {position: relative;}

.g_section {position:relative;min-width:1280px;margin-bottom:0; padding-bottom:250px;}
.g_section:nth-last-of-type(1) {padding-bottom:0;}

/* top title */
.g_section.section_top {width:100%;height:100vh;z-index:2;}
.g_section.section_top .g_title1_en {top:50%;left:50%; width:100%; font-size:104px;text-align:center;transform:translate(-50%,-50%); position:absolute;margin-top:100px;opacity:0;}
.g_section.section_top .scroll_line {opacity:0;}

/* fix title */
.g_section.title_area {width:100vw;min-width:1280px;min-height:100vh;position:relative;}
.g_section.title_area h1 {position:absolute;text-align:center;top:50%;left:0;transform:translateY(-50%);font-size:6vw;letter-spacing:-4px;width:100%;display:block;overflow:hidden;max-height:104px;}
.g_section.title_area h1.fixed {position:fixed;top:50%;left:0;transform:translateY(-50%);width:100%;z-index:10;}
.g_section.title_area h1 span {display:block;transition:all .2s ease-in-out;}
.g_section.title_area h1 span>span {opacity:0;}
.g_section.title_area h1 span>span.on {opacity:1;}

.title_area {position:fixed;top:50%; left: 50%; transform: translate(-50%,-50%); width:100%; text-align:center;z-index:1;opacity:0; display:none;}
.title_area.on {opacity:1;transition:all .5s; display:block;}
.title_area .fix_title {pointer-events:none; font-feature-settings: normal;}
.title_area p {opacity:0; position:absolute;width:100%;left:50%;top:-50%;transform:translate(-50%,-50%); font-size:0;}
.title_area p.on {opacity:1;}
.title_area p em {display:inline-block;font-size:48px;font-weight:700;line-height:1;text-align:left;margin-right:32px;}
.title_area p span {font-size:6vw;}

.g_section .text {text-align:left;position:absolute; word-break: break-word;}
.g_section .text a {font-family: "Montserrat", "NotoSans", sans-serif; font-weight:500; display:block;color:#0965bc; margin-top:20px;}
.g_section .text a span {position:relative;}
.g_section .text a span:after {content: ''; position:absolute;background:url(../images/ico_arrow_right_blue.svg) no-repeat center / contain;width:6px;height:11px;right:-15px;top:50%;transform:translateY(-50%);transition:all .3s;}
.g_section .text a:hover span:after {right:-21px;}
.g_section .text a span img { display:none;}
.g_section .img {overflow:hidden;background-size:cover;background-position:center top;position:relative;transform: scaleX(0.8) scaleY(0.8) scaleZ(1);}
.g_section .img img {transform: scaleX(1.2) scaleY(1.2) scaleZ(1) translateY(-5%); width:100%;}

@media screen and (-ms-high-contrast: active), (-ms-high-contrast: none){
  .g_section .img {transform: scaleX(1) scaleY(1) scaleZ(1);}
  .g_section .img img {transform: scaleX(1) scaleY(1) scaleZ(1) translateY(-50%);top:50%; position:relative;}
}

.g_section .caption {font-size:14px;color:#878787; margin-top:10px; text-align:right;}

.g_title2_en {font-size:6vw;font-weight:700;line-height:1;letter-spacing:-2px;text-align:center;color:#ff6a13;margin-bottom:90px;display:none;}
.g_title2_en em {display:inline-block;font-size:48px;font-weight:700;line-height:1;text-align:left;margin-right:30px;}
.g_title2_en.fixed {position:fixed;top:50%;left:50%;transform:translate(-50%,-50%);z-index:2;width:100%;display:none;}

.section1 {padding-top:200px;}

.section:nth-of-type(5n + 1) .img1 {max-width:1275px;max-height:678px;width:83.33333333%;height:35.328vw;margin-left:16.666666%;}
.section:nth-of-type(5n + 1) .img2 {max-width:626px;max-height:500px;width:41.666666%;height:26.042vw; margin-left:8.333333%; margin-top:-130px;}
.section:nth-of-type(5n + 1) .img3 {max-width:886px;max-height:600px;width:58.33333333%;height:31.250vw;margin-left:33.333333%; margin-top:250px;}
.section:nth-of-type(5n + 1) .text {margin-top:-5.729vw;margin-left:50%;}
.section:nth-of-type(5n + 2) .img1 {max-width:1016px;max-height:564px;width:66.66666667%;height:29.375vw;}
.section:nth-of-type(5n + 2) .img2 {max-width:496px;max-height:760px;width:33.333333%;height:39.583vw; margin-left:58.33333333%; margin-top:150px;}
.section:nth-of-type(5n + 2) .img3 {max-width:780px;max-height:602px;width:50%;height:31.354vw;margin-left:16.666666%; margin-top:-118px;}
.section:nth-of-type(5n + 2) .text {margin-top:-600px;margin-left:16.666666%;}
.section:nth-of-type(5n + 3) .img1 {max-width:602px;max-height:922px;width:41.666666%;height:28.021vw; margin-left:8.333333%;}
.section:nth-of-type(5n + 3) .img2 {max-width:626px;max-height:500px;width:41.666666%;height:26.042vw; margin-left:58.33333333%; margin-top:183px;}
.section:nth-of-type(5n + 3) .img3 {max-width:886px;max-height:600px;width:58.33333333%;height:31.250vw; margin-left:16.666666%; margin-top:-78px;}
.section:nth-of-type(5n + 3) .text {margin-top:-600px; margin-left:50%;}
.section:nth-of-type(5n + 4) .img1 {max-width:1016px;max-height:600px;width:58.33333333%;height:31.250vw;margin-left:25%;}
.section:nth-of-type(5n + 4) .img2 {max-width:780px;max-height:602px;width:50%;height:31.354vw; margin-top:-108px;}
.section:nth-of-type(5n + 4) .img3 {max-width:496px;max-height:760px;width:33.333333%;height:39.583vw; margin-left:66.66666667%; margin-top:-115px;}
.section:nth-of-type(5n + 4) .text {margin-top:-5.729vw;margin-left:46% !important;}
.section:nth-of-type(5n + 5) .img1 {max-width:1276px;max-height:700px;width:83.33333333%;height:36.458vw;margin-left:8.333333%;}
.section:nth-of-type(5n + 5) .img2 {max-width:496px;max-height:496px;width:33.333333%;height:25.833vw;margin-left:16.666666%; margin-top:350px;}
.section:nth-of-type(5n + 5) .img3 {max-width:886px;max-height:600px;width:58.33333333%;height:31.250vw;margin-left:41.666666%; margin-top:-94px;}
.section:nth-of-type(5n + 5) .text {margin-top:-610px;margin-left:50%;}

.section.section8 .img3 + .caption {max-width:886px;width:58.33333333%;margin-left:16.666666%; text-align:right;}

/* progress bar */
.fix_area {transform:translateX(-100px) rotate(-90deg);position:fixed;bottom:55%;left:-274px;opacity:0; font-weight:400; height:20px;z-index:2;transition: all .3s;}
.fix_area.on {transform:translateX(0) rotate(-90deg);opacity:1;}
.fix_area .scroll_bar > div, .scroll_bar > ul {display:inline-block;vertical-align:middle;}
.fix_area .scroll_bar .scroll {height:2px;width:360px;background:#dcdcdc;vertical-align:middle;margin:-2px 30px 0;transform:rotate(-180deg);}
.fix_area .scroll_bar .scroll .flex {display: flex; position: absolute; top: 50%; left: 0; transform: translateY(-50%); width: 100%; height: 6px;}
.fix_area .scroll_bar .scroll .flex a {display: block;width: 100%;height: 6px;cursor: pointer;}
.fix_area .scroll_bar .scroll i {display:block;width:0;height:2px;background:#111;transition:all .2s ease-out;}

.fix_area .scroll_bar .comment {display:inline-block;height:18px;overflow:hidden;}
.fix_area .scroll_bar .comment ul {transition:all .3s ease-in-out;}
.fix_area .scroll_bar .comment li {line-height:1; margin-bottom:10px; width:100%; height:16px; font-weight:600;}

.fix_area .scroll_bar .page {color:rgba(17, 17, 17, 0.4);;}
.fix_area .scroll_bar .page .current {color:#111; width:15px; padding-right:5px;display:inline-block; text-align:right; font-weight:500;}
.fix_area .scroll_bar .page .total {padding-left:5px; width:15px; display:inline-block;}

.title_area p:nth-of-type(1), .fix_area .scroll_bar .comment li:nth-of-type(1)   {color:#53b5c1;}
.title_area p:nth-of-type(2), .fix_area .scroll_bar .comment li:nth-of-type(2)   {color:#ee8443;}
.title_area p:nth-of-type(3), .fix_area .scroll_bar .comment li:nth-of-type(3)   {color:#4fc4f4;}
.title_area p:nth-of-type(4), .fix_area .scroll_bar .comment li:nth-of-type(4)   {color:#d1ab61;}
.title_area p:nth-of-type(5), .fix_area .scroll_bar .comment li:nth-of-type(5)   {color:#004d99;}
.title_area p:nth-of-type(6), .fix_area .scroll_bar .comment li:nth-of-type(6)   {color:#ff6b12;}
.title_area p:nth-of-type(7), .fix_area .scroll_bar .comment li:nth-of-type(7)   {color:#00bab5;}
.title_area p:nth-of-type(8), .fix_area .scroll_bar .comment li:nth-of-type(8)   {color:#ff4b47;}
.title_area p:nth-of-type(9), .fix_area .scroll_bar .comment li:nth-of-type(9)   {color:#bfd400;}
.title_area p:nth-of-type(10), .fix_area .scroll_bar .comment li:nth-of-type(10) {color:#e888ad;}
.title_area p:nth-of-type(11), .fix_area .scroll_bar .comment li:nth-of-type(11) {color:#5367ff;}
.title_area p:nth-of-type(12), .fix_area .scroll_bar .comment li:nth-of-type(12) {color:#c00000;}
.title_area p:nth-of-type(13), .fix_area .scroll_bar .comment li:nth-of-type(13) {color:#f970f3;}
.title_area p:nth-of-type(14), .fix_area .scroll_bar .comment li:nth-of-type(14) {color:#2b84fe;}
.title_area p:nth-of-type(15), .fix_area .scroll_bar .comment li:nth-of-type(15) {color:#c96597;}
.title_area p:nth-of-type(16), .fix_area .scroll_bar .comment li:nth-of-type(16) {color:#e5b14b;}
.title_area p:nth-of-type(17), .fix_area .scroll_bar .comment li:nth-of-type(17) {color:#853399;}
.title_area p:nth-of-type(18), .fix_area .scroll_bar .comment li:nth-of-type(18) {color:#ffc746;}
.title_area p:nth-of-type(19), .fix_area .scroll_bar .comment li:nth-of-type(19) {color:#69bf4a;}
.title_area p:nth-of-type(20), .fix_area .scroll_bar .comment li:nth-of-type(20) {color:#00a1de;}
.title_area p:nth-of-type(21), .fix_area .scroll_bar .comment li:nth-of-type(21) {color:#f780b5;}


@media screen and (max-width:1281px) {
  .g_section.title_area h1,.g_section.title_area h1.fixed {min-width:1280px;}
  .g_section.title_area h1,.g_title2_en {font-size:77px;}

  .section:nth-of-type(5n + 1) .img1 {width:850px;height:452px;}
  .section:nth-of-type(5n + 1) .img2 {width:418px;height:334px;}
  .section:nth-of-type(5n + 1) .img3 {width:590px;height:400px;}
  .section:nth-of-type(5n + 2) .img1 {width:678px;height:376px;}
  .section:nth-of-type(5n + 2) .img2 {width:331px;height:507px;}
  .section:nth-of-type(5n + 2) .img3 {width:520px;height:402px;}
  .section:nth-of-type(5n + 3) .img1 {width:402px;height:615px;}
  .section:nth-of-type(5n + 3) .img2 {width:418px;height:334px;}
  .section:nth-of-type(5n + 3) .img3 {width:590px;height:400px;}
  .section:nth-of-type(5n + 4) .img1 {width:668px;height:400px;}
  .section:nth-of-type(5n + 4) .img2 {width:520px;height:402px;}
  .section:nth-of-type(5n + 4) .img3 {width:331px;height:507px;}
  .section:nth-of-type(5n + 5) .img1 {width:851px;height:467px;}
  .section:nth-of-type(5n + 5) .img2 {width:331px;height:331px;}
  .section:nth-of-type(5n + 5) .img3 {width:590px;height:400px;}

  .section.section8 .img3 + .caption {width:590px;}
}
@media screen and (min-width:1921px) {
  .g_section.title_area h1,.g_title2_en {font-size:104px;}
}
@media screen and (max-width:1920px) {
  .g_section.title_area h1,.g_title2_en {font-size:104px;}
}


@keyframes bgFull {
  0% {height:80px;}
  100% {height:442px;}
}
@keyframes textAni {
  from {opacity:0;transform:translateY(200px);}
  to {opacity:1;transform:translateY(0);}
}