/* idx_section1 */
.idx_section1_wrap { position: relative; width: 100%;}
.idx_section1 .item {position: relative;}
.idx_section1 .item .title { position: absolute; width: 100%; max-width: 1640px; padding: 0 20px; bottom: 40px; left: 50%; transform: translate(-50%, -50%); font-weight: 300; font-size: 4.5rem; color: #fff; letter-spacing: -1px;}
.idx_section1 .item .title span {display: block; font-weight: 200; font-size: 3rem; letter-spacing: 0; margin-bottom: 20px;}
.idx_section1 .item .title b {font-weight: 700;}
.idx_section1 .item1,
.idx_section1 .item2,
.idx_section1 .item3 {position: relative; width: 100%; height: 950px; background-repeat:no-repeat; background-position: 50% bottom; background-size: cover; z-index: 0;}
.idx_section1 .item1 { background-image: url(/img/index/idx_section1_1.jpg);}
.idx_section1 .item2 { background-image: url(/img/index/idx_section1_2.jpg);}
.idx_section1 .item3 { background-image: url(/img/index/idx_section1_3.jpg);}

.idx_section1_wrap .bx-controls { position: absolute; top: 50%; left: 0; width: 100%;}
.idx_section1_wrap .bx-controls-direction { position: relative; max-width: 1640px; margin: 0 auto; padding: 0 20px;}
.idx_section1_wrap .bx-wrapper .bx-controls-direction a {width: 44px; height: 69px; margin-top: -35px;}
.idx_section1_wrap .bx-wrapper .bx-prev,
.idx_section1_wrap .bx-wrapper .bx-next {display: none;}
.idx_section1_pager {position: absolute; bottom:70px; left: 0; width: 100%;}
.idx_section1_pager > div { width: 100%; max-width: 1640px; margin: 0 auto; padding: 0 20px; font-size: 0;}
.idx_section1_pager a { display: inline-block; width: 120px; padding: 10px; margin-right: 5px; border-bottom: 1px solid #fff;}
.idx_section1_pager a.active { border-bottom: 2px solid #fff; border-color: #00b0f0;}

@media ( max-width: 1600px ) {
  .idx_section1 .item1,
  .idx_section1 .item2,
  .idx_section1 .item3 { height: 900px;}
}

@media ( max-width: 1024px ) {
  .idx_section1 .item .title { bottom: 10px; font-size: 2.7rem; color: #fff; letter-spacing: -1px;}
  .idx_section1 .item .title span {display: block; font-weight: 200; font-size: 1.8rem; letter-spacing: 0; margin-bottom: 10px;}
  .idx_section1 .item .title b {font-weight: 700;}
  .idx_section1 .item .title b.block { display: block; }
  .idx_section1 .item .title br { display: none; }
  .idx_section1 .item1,
  .idx_section1 .item2,
  .idx_section1 .item3 { height: 500px;}
  .idx_section1_pager {position: absolute; bottom:30px;}
  .idx_section1_pager a { width: 55px; }
}

@media ( max-width: 768px ) {
  .idx_section1 .item .title { font-size: 2.6rem; }
  .idx_section1 .item .title span { font-size: 1.7rem; margin-bottom: 5px;}
}

/* idx_section2 */
.idx_section2_wrap { position: relative; width: 100%; background: url(/img/index/idx_section2_bg.png) no-repeat 50% top;}
.idx_section2 { width: 100%; max-width: 1640px; margin: 0 auto; padding: 125px 20px 100px;}
.idx_section2 h2 { font-size: 5.5rem; text-transform:inherit; font-weight: 500; letter-spacing: -1.2px;}
.idx_section2 h2 b { color: #00b0f0; font-weight: 900;}
.idx_section2 h2 span { display: block; font-size: 1.7rem; color: #666; font-weight: 300; letter-spacing: -0.7px;}
.idx_section2 > ul { font-size: 0; }
.idx_section2 > ul li { position: relative; display: inline-block; margin: 30px 1px 0 0; width: 33.25%; vertical-align: top}
.idx_section2 > ul li a { display: block; width: 100%; height: 430px; padding: 230px 40px 0 60px; color: #fff; }
.idx_section2 > ul li h3 { position: relative; display: table; padding: 5px 0 25px; font-size: 4rem; font-weight: 300; letter-spacing: -0.7px; z-index: 9;}
.idx_section2 > ul li h3::before { content: ' '; position: absolute; top:0; left: 0; width: 65px; height: 1px; border-top: 1px solid rgba(255, 255, 255, 0.5); z-index: 9;}
.idx_section2 > ul li h3::after  { content: ' '; position: absolute; top:18px; right: -35px; width: 30px; height: 30px; background: url(/img/index/idx_section2_arr.png) no-repeat 50% top; transition: 0.7s ease-out; z-index: 9; opacity: 0;}
.idx_section2 > ul li a:hover h3::after { opacity: 0.9;}
.idx_section2 > ul li span { position: relative; font-weight: 200; line-height: 140%; z-index: 9;}
.idx_section2 > ul li:last-child { margin-right: 0;}
.idx_section2 > ul li:nth-child(1),
.idx_section2 > ul li:nth-child(2),
.idx_section2 > ul li:nth-child(3) { background-repeat:no-repeat; background-position: 50% 70%; background-size: cover;}
.idx_section2 > ul li:nth-child(1) { background-image: url(/img/index/idx_section2_i1.jpg);}
.idx_section2 > ul li:nth-child(2) { background-image: url(/img/index/idx_section2_i2.jpg);}
.idx_section2 > ul li:nth-child(3) { background-image: url(/img/index/idx_section2_i3.jpg);}
.idx_section2 > ul li a::before { content: ' '; position: absolute; top:0; left: 0; width: 100%; height: 100%; background-color:rgba(0, 0, 0, 0.75); transition: 0.7s ease-out; z-index: 1;}
.idx_section2 > ul li a:hover::before { transition: 0.7s ease-out; background-color:rgba(0, 0, 0, 0.35); }

@media ( max-width: 1400px ) {
  .idx_section2 > ul li a { padding: 170px 40px 0;}
}
@media ( max-width: 1200px ) {
  .idx_section2 { padding: 40px 20px;}
  .idx_section2 > ul li { width: 33.2%;}
  .idx_section2 > ul li a br {display: none;}
  .idx_section2 > ul li h3 { font-size: 3rem;}
  .idx_section2 > ul li h3::after  { display: none;}
}

@media ( max-width: 1024px ) {
  .idx_section2_wrap { background-size: 1024px;}
  .idx_section2 h2 { font-size: 3.3rem; letter-spacing: -0.5px;}
  .idx_section2 h2 span { font-size: 1.5rem;  letter-spacing:inherit;}
  .idx_section2 > ul li a { padding: 100px 40px 0;}
}

@media ( max-width: 768px ) {
  .idx_section2_wrap { background-size: 1024px;}
  .idx_section2 { padding: 40px 20px;}
  .idx_section2 h2 { font-size: 3rem; letter-spacing: -1px;}
  .idx_section2 h2 span { font-size: 1.4rem; }
  .idx_section2 > ul li { width: 100%; margin: 15px 1px 0 0; }
  .idx_section2 > ul li a { width: 100%; height: 200px; padding: 30px 25px 25px 25px; }
  .idx_section2 > ul li h3 { padding: 5px 0 10px; font-size: 2.4rem; font-weight: 500; letter-spacing: 0;}
  .idx_section2 > ul li span { font-size: 1.35rem;}
}

/* idx_section3 */
.idx_section3_wrap { position: relative; width: 100%; font-size: 0;}
.idx_section3_wrap > div {position: relative; display: inline-block; width: 50%; height: 420px; vertical-align: top;}
.idx_section3_wrap > div::before { content: ' '; position: absolute; top:0; left: 0; width: 100%; height: 100%; background-color:rgba(0, 0, 0, 0.7); transition: 0.7s ease-out; z-index: 1;}
.idx_section3_wrap > div:hover::before { transition: 0.7s ease-out; background-color:rgba(0, 0, 0, 0.3); }
.idx_section3_wrap div.left,
.idx_section3_wrap div.right { background-repeat:no-repeat;  background-size: cover;}
.idx_section3_wrap div.left  { background-image: url(/en/img/index/idx_section3_map.jpg); background-position: right 50%; border-right: 1px solid #fff;}
.idx_section3_wrap div.right { background-image: url(/en/img/index/idx_section3_map.jpg); background-position: left 50%;}
.idx_section3_wrap .title { position: absolute; width: 800px; padding-right: 50px; font-size: 1.6rem; font-weight: 200; color: #fff; z-index: 9;}
.idx_section3_wrap .title h3 { position: relative; display: table; margin-bottom: 85px; font-size: 4.5rem; }
.idx_section3_wrap .title h3::before { content: ' '; position: absolute; left:0; bottom: -2px; width: 100%; height: 1px; border-bottom: 1px solid rgba(255, 255, 255, 0.22);}
.idx_section3_wrap .title span { margin-right: 10px; margin-bottom: 5px;}
.idx_section3_wrap .title span.block { display: block; }
.idx_section3_wrap .title a.btn { display: table; margin-top: 30px; padding: 10px 47px 10px 25px; border-radius: 30px; background: rgba(0, 0, 0, 0.4) url(/img/index/idx_section3_arr.png) no-repeat 85% 50%; border: 1px solid rgba(255, 255, 255, 0.4); transition: 0.7s ease-out; letter-spacing: 0;}
.idx_section3_wrap .title a.btn:hover { background-color: #00b0f0; border: 1px solid rgba(255, 255, 255, 0.7); transition: 0.7s ease-out;}
.idx_section3_wrap div.left > .title  { top:100px; right:0; }
.idx_section3_wrap div.right > .title { top:100px; left:50px;}


@media ( max-width: 1700px ) {
  .idx_section3_wrap .title  { width: 100%; padding-left: 30px;}
  .idx_section3_wrap div.right > .title { left:0;}
}

@media ( max-width: 1024px ) {
  .idx_section3_wrap > div { height: 300px; }
  .idx_section3_wrap .title { font-size: 1.5rem; padding-right: 20px; }
  .idx_section3_wrap .title h3 { margin-bottom: 25px; font-size: 2.7rem;}
  .idx_section3_wrap .title span {display: block; margin-bottom: 3px;}
  .idx_section3_wrap .title a.btn { font-size: 1.5rem;}
  .idx_section3_wrap div.left > .title  { top:40px; }
  .idx_section3_wrap div.right > .title { top:40px; }
}

@media ( max-width: 768px ) {
    .idx_section3_wrap { margin-bottom: 40px; padding: 0 20px;}
    .idx_section3_wrap > div { width:100%; border-top: 1px solid #fff;}
    .idx_section3_wrap .title span.block { margin-bottom: 7px; }
}

@media ( max-width: 500px ) {
  .idx_section3_wrap > div { height: 320px; }
  .idx_section3_wrap .title { font-size: 1.5rem; padding-right: 20px; }
  .idx_section3_wrap .title h3 { margin-bottom: 25px; font-size: 2.7rem;}
  .idx_section3_wrap .title span {display: block; margin-bottom: 3px;}
  .idx_section3_wrap .title a.btn { font-size: 1.5rem;}
  .idx_section3_wrap div.left > .title  { top:40px; }
  .idx_section3_wrap div.right > .title { top:40px; }
}
