#main_v { position: relative; margin-bottom: 5rem; }
#main_v img { width: 100%; }
#main_v h2 { font-size: 4.8vw; color: #00765a; position: absolute; display: flex; justify-content: center; align-items: center; flex-direction: column; letter-spacing: 0.05em; top: 0; left: 0px; width: 100%; height: 100%; text-align: center; line-height: 1; padding: 0.8em 0; color: #FFF; }
#main_v h2 span { display: inline-block; font-size: 0.65em; margin-top: 0.5em; }

.txt_box { background: url("../img/title_bg.png") -100vw 0/100% no-repeat; position: relative; margin-bottom: 13vw; transition-duration: 1s; top: 0px; }
.txt_box.scrollin { background: url("../img/title_bg.png") 0 0/100% no-repeat; }
.txt_box .title { color: #FFF; font-size: 2.4vw; padding: 0em 0 0em 3em; line-height: 1.4; height: 6.9em; display: flex; align-items: center; font-family: "Zen Kaku Gothic Antique", sans-serif; }
.txt_box .title h3 span { background: #00765a; line-height: 1.2; display: inline-block; }
.txt_box .img { position: absolute; top: 8vw; right: 0px; width: 46vw; z-index: 1; }
.txt_box .img img { width: 100%; }
.txt_box .img.scrollin { top: 3vw; }
.txt_box .img .btn_green { position: absolute; right: 4vw; bottom: 2vw; }
.txt_box .img .btn_green a { font-size: min(1.5vw,1.8rem); }
.txt_box .img .btn_green.wide a { width: 20em; }
.txt_box .txt { font-size: min(1.5vw,2.2rem); margin: 3em 0 0 7.5vw; line-height: 1.7; }

.txt_box.right { background: url("../img/title_bg2.png") 100vw 0/100% no-repeat; margin-bottom: 8vw; transition-duration: 1s; }
.txt_box.right.scrollin { background: url("../img/title_bg2.png") 0 0/100% no-repeat; }
.txt_box.right .title { padding: 0em 0 0em 20.5em; }
.txt_box.right .img { right: auto; left: 0px; }
.txt_box.right .txt { margin-left: 51vw; margin-right: 3vw; }

main ul.slide { margin-bottom: 15rem; }
main ul.slide .slick-next { background: url(/common/img/btn_next.png) center center/contain no-repeat !important; width: 3vw; height: 3vw; top: 8vw; right: 23vw; }
main ul.slide .slick-prev { background: url(/common/img/btn_prev.png) center center/contain no-repeat !important; width: 3vw; height: 3vw; top: 8vw; left: 23vw; }
main ul.slide .slick-slide { margin: 0 3vw; opacity: 0.5; pointer-events: none; }
main ul.slide .slick-slide.slick-active { opacity: 1; pointer-events: auto; }
main ul.slide a { position: relative; display: block; }
main ul.slide a p { position: absolute; width: 100%; height: 100%; display: flex; justify-content: center; align-items: center; color: #FFF; top: 0px; left: 0px; font-size: 2.5vw; }

main .inner .in { width: 87.441%; margin: 0 auto; }

#worldmap { margin-bottom: 1em; height: 345px; }
#worldmap .map { width: calc(663 / 1100 * 100%); position: relative; }
#worldmap .map ul li { width: calc(56 / 663 * 100%); padding: calc(56 / 663 * 100%) 0 0 0; top: 0; left: 0; position: absolute; transition-duration: 0.3s; cursor: pointer; }
#worldmap .map ul li.saujiarabia { background: url("../img/flag01.png") 0 0/contain no-repeat; margin: calc(64 / 663 * 100%) 0 0 calc(83 / 663 * 100%); }
#worldmap .map ul li.saujiarabia:hover, #worldmap .map ul li.saujiarabia.active { background: url("../img/flag01_hover.png") 0 0/contain no-repeat; }
#worldmap .map ul li.bahrain { background: url("../img/flag02.png") 0 0/contain no-repeat; margin: calc(209 / 663 * 100%) 0 0 calc(97 / 663 * 100%); }
#worldmap .map ul li.bahrain:hover, #worldmap .map ul li.bahrain.active { background: url("../img/flag02_hover.png") 0 0/contain no-repeat; }
#worldmap .map ul li.korea { background: url("../img/flag03.png") 0 0/contain no-repeat; margin: calc(110 / 663 * 100%) 0 0 calc(163 / 663 * 100%); }
#worldmap .map ul li.korea:hover, #worldmap .map ul li.korea.active { background: url("../img/flag03_hover.png") 0 0/contain no-repeat; }
#worldmap .map ul li.thailand { background: url("../img/flag04.png") 0 0/contain no-repeat; margin: calc(234 / 663 * 100%) 0 0 calc(149 / 663 * 100%); }
#worldmap .map ul li.thailand:hover, #worldmap .map ul li.thailand.active { background: url("../img/flag04_hover.png") 0 0/contain no-repeat; }
#worldmap .map ul li.vietnam { background: url("../img/flag05.png") 0 0/contain no-repeat; margin: calc(167 / 663 * 100%) 0 0 calc(243 / 663 * 100%); }
#worldmap .map ul li.vietnam:hover, #worldmap .map ul li.vietnam.active { background: url("../img/flag05_hover.png") 0 0/contain no-repeat; }
#worldmap .map ul li.japan { background: url("../img/flag06.png") 0 0/contain no-repeat; top: 33%; left: 48.2%; }
#worldmap .map ul li.japan:hover, #worldmap .map ul li.japan.active { background: url("../img/flag06_hover.png") 0 0/contain no-repeat; }
#worldmap .map ul li.japan2 { background: url("../img/flag06.png") 0 0/contain no-repeat; top: 33%; left: 58.2%; }
#worldmap .map ul li.japan2:hover, #worldmap .map ul li.japan2.active { background: url("../img/flag06_hover.png") 0 0/contain no-repeat; }
#worldmap .map ul li.america { background: url("../img/flag07.png") 0 0/contain no-repeat; margin: calc(105 / 663 * 100%) 0 0 calc(545 / 663 * 100%); }
#worldmap .map ul li.america:hover, #worldmap .map ul li.america.active { background: url("../img/flag07_hover.png") 0 0/contain no-repeat; }
#worldmap .map ul li.america2 { background: url("../img/flag07.png") 0 0/contain no-repeat; margin: calc(105 / 663 * 100%) 0 0 calc(607 / 663 * 100%); }
#worldmap .map ul li.america2:hover, #worldmap .map ul li.america2.active { background: url("../img/flag07_hover.png") 0 0/contain no-repeat; }
#worldmap .map ul li.indonesia { background: url("../img/flag08.png") 0 0/contain no-repeat; margin: calc(260 / 663 * 100%) 0 0 calc(216 / 663 * 100%); }
#worldmap .map ul li.indonesia:hover, #worldmap .map ul li.indonesia.active { background: url("../img/flag08_hover.png") 0 0/contain no-repeat; }
#worldmap .right { width: 32.819%; }
#worldmap .right h3 { font-size: 2.2rem; display: flex; align-items: center; margin-bottom: 0.7em; line-height: 1.3; height: 3.5em; }
#worldmap .right h3 img { width: 2.591em; margin-right: 1em; }
#worldmap .right .url { font-size: 1.5rem; margin-top: 1em; height: 1.5em; }

main .detail { justify-content: space-between; margin-top: 2em; }
main .detail .name { width: 100%; font-size: 1.8rem; margin-bottom: 0.5em; }
main .detail table { width: 48%; }
main .detail table + p { font-size: 1.8rem; margin-top: 1.5rem; }
main .detail table:last-of-type { /*margin-top:0.5em;*/ }
main .detail table:nth-of-type(2) { margin-right: 0px; }
main .detail table tr th { font-weight: normal; font-size: 1.8rem; text-align: left; padding-top: 0.3em; padding-bottom: 0.3em; width: 40%; }
main .detail table tr th span { width: 100%; display: block; position: relative; padding-right: 1em; }
main .detail table tr th span:after { content: ""; position: absolute; right: 0px; top: 50%; height: 1em; border-right: 1px solid #ccc; margin-top: -0.4em; }
main .detail table tr th a { text-decoration: underline; }
main .detail table tr td { padding-top: 0.3em; padding-bottom: 0.3em; font-size: 1.8rem; padding-left: 1.5em; word-break: break-all; vertical-align: middle; width: 60%; }
main .detail table tr td.url { white-space: nowrap; }

#interview { background: url("../img/interview_bg.jpg") center 0/cover no-repeat; margin: 10rem 0; padding: 3%; padding-top: 12%; position: relative; }
#interview h3 { color: #FFF; font-size: 4.4rem; line-height: 1.3; }
#interview h3 span { font-size: 2.6rem; color: #FFF; display: inline-block; border: solid 1px #FFF; padding: 0 0.5em; margin-bottom: 1em; }
#interview h3 + p { font-size: 2.8rem; color: #FFF; line-height: 1.3; margin-top: 1em; }
#interview .btn_white { position: absolute; right: 5%; bottom: 5%; }

#interview2 { background: url("../img/interview2_bg.jpg") center 0/cover no-repeat; margin: 10rem 0; padding: 3%; padding-top: 12%; position: relative; }
#interview2 h3 { color: #FFF; font-size: 4.4rem; line-height: 1.3; }
#interview2 h3 span { font-size: 2.6rem; color: #FFF; display: inline-block; border: solid 1px #FFF; padding: 0 0.5em; margin-bottom: 1em; }
#interview2 h3 + p { font-size: 2.8rem; color: #FFF; line-height: 1.3; margin-top: 1em; }
#interview2 .btn_white { position: absolute; right: 5%; bottom: 5%; }

#interview3 { background: url("../img/interview3_bg.jpg") center 0/cover no-repeat; margin: 10rem 0; padding: 3%; padding-top: 12%; position: relative; }
#interview3 h3 { color: #FFF; font-size: 4.4rem; line-height: 1.3; }
#interview3 h3 span { font-size: 2.6rem; color: #FFF; display: inline-block; border: solid 1px #FFF; padding: 0 0.5em; margin-bottom: 1em; }
#interview3 h3 + p { font-size: 2.8rem; color: #FFF; line-height: 1.3; margin-top: 1em; }
#interview3 .btn_white { position: absolute; right: 5%; bottom: 5%; }

#chalenge { background: url("../img/chalenge_bg.jpg") 0 0/100% no-repeat; background-color: #f6f7f7; padding-bottom: 12rem; }
#chalenge h3 { font-size: 4rem; text-align: center; padding: 2.5em 0 2em 0; }
#chalenge h3 span { color: #00765a; }
#chalenge .flex { padding-bottom: 5rem; }
#chalenge .flex div { width: 48%; }
#chalenge .flex div p { font-size: 2rem; margin-bottom: 2em; line-height: 2; }
#chalenge .flex div h4 { font-size: 3.6rem; }
#chalenge .banner p { font-size: 2.2rem; text-align: center; margin-bottom: 1.5em; }
#chalenge .banner ul { display: flex; justify-content: space-between; flex-wrap: wrap; max-width: 820px; margin: 0 auto; }
#chalenge .banner ul li { text-align: center; /*width:30.207%;*/ width: 46.343%; }
#chalenge .banner ul li a p { font-size: 2rem; margin-top: 1em; }

#history { opacity: 0; position: absolute; left: -10000px; overflow: hidden; width: 90vw; }
#history.show { opacity: 1; position: relative; left: auto; }
#history .slick-slide { margin: 0 2vw; }
#history ul { padding: 5% 0; margin-right: -5vw; margin-left: 5vw; transition-duration: 0.3s; }
#history ul li { text-align: center; position: relative; }
#history ul li:before { content: ""; position: absolute; top: 71%; width: 1.5vw; height: 1.5vw; background-color: #00765a; border-radius: 50%; left: 50%; margin-left: -0.75vw; }
#history ul li:after { content: ""; position: absolute; top: 73%; width: 120%; left: -10%; border-top: 0.3vw solid #00765a; }
#history ul li.first:after { left: 50%; width: 60%; }
#history ul li.last:after { left: -10%; width: 60%; }
#history ul li.dammy:before { display: none; }
#history ul li.dammy:after { display: none; }
#history ul li p { margin-top: 2em; font-size: 2.2vw; line-height: 1.4; }
#history ul li p span { font-size: 0.6em; line-height: 1.3; display: block; height: 3em; }
#history .slick-prev { background: url(../img/btn_prev.png) center center/contain no-repeat !important; width: 6vw; height: 100%; top: 0; left: -4.9vw; }
#history .slick-next { background: url(../img/btn_next.png) center center/contain no-repeat !important; width: 6vw; height: 100%; top: 0; right: 5.9vw; }
#history ul.left { margin-right: 0vw; margin-left: 0vw; }
#history ul.left .slick-prev { left: 0vw; }

#make { display: block; max-height: 1000px; height: 100%; width: auto; margin: 0 auto; }

footer { margin-top: 0px; }

@media screen and (min-width: 768px) and (max-width: 1258px) { #worldmap { height: 26vw; }
  #worldmap .right h3 { font-size: 1.7vw; }
  #worldmap .right h3 img { width: 2.59em; }
  #worldmap .right .url { font-size: 1.1vw; }
  main .detail table tr th { font-size: 1.3vw; }
  main .detail table tr td { font-size: 1.3vw; }
  main .detail table + p { font-size: 1.3vw; }
  #interview h3 { font-size: 4vw; }
  #interview h3 span { font-size: 2.2vw; }
  #interview h3 + p { font-size: 1.9vw; }
  #interview .btn_white a { font-size: 1.7vw; }
  #interview2 h3 { font-size: 4vw; }
  #interview2 h3 span { font-size: 2.2vw; }
  #interview2 h3 + p { font-size: 1.9vw; }
  #interview2 .btn_white a { font-size: 1.7vw; }
  #interview3 h3 { font-size: 4vw; }
  #interview3 h3 span { font-size: 2.2vw; }
  #interview3 h3 + p { font-size: 1.9vw; }
  #interview3 .btn_white a { font-size: 1.7vw; }
  #chalenge h3 { font-size: 3.5vw; }
  #chalenge .flex div p { font-size: 1.5vw; }
  #chalenge .flex div h4 { font-size: 3vw; } }
@media screen and (max-width: 767px) { #main_v { margin-bottom: 1rem; }
  #main_v h2 { font-size: 8vw; }
  .txt_box { background: url(../img/title_bg_sp.png) -100vw 0/100% no-repeat; position: relative; margin-bottom: 13vw; transition-duration: 0.6s; }
  .txt_box.scrollin { background: url("../img/title_bg_sp.png") 0 0/100% no-repeat; }
  .txt_box .title { font-size: 4vw; padding: 0em 0 0em 1.5em; margin-bottom: 1em; }
  .txt_box .img { position: relative; top: 3em; right: auto; width: 95vw; margin-left: 5vw; }
  .txt_box .img.scrollin { top: -1em; }
  .txt_box .img .btn_green { right: 8vw; }
  .txt_box .img .btn_green a { font-size: 3.5vw; }
  .txt_box .txt { font-size: 3.8vw; margin: 0.5em 1.5em 0 1.5em; }
  .txt_box.right { background: url(../img/title_bg2_sp.png) 100vw 0/100% no-repeat; margin-bottom: 13vw; transition-duration: 0.6s; }
  .txt_box.right.scrollin { background: url("../img/title_bg2_sp.png") 0 0/100% no-repeat; }
  .txt_box.right .title { padding: 0em 0 0em 6.5em; }
  .txt_box.right .img { margin-left: 0px; }
  .txt_box.right .txt { margin-left: 1.5em; margin-right: 1.5em; }
  main ul.slide { margin-bottom: 9rem; }
  main ul.slide .slick-slide { margin: 0 10vw; }
  main ul.slide .slick-next { width: 8vw; height: 8vw; top: 12vw; right: 1vw; }
  main ul.slide .slick-prev { width: 8vw; height: 8vw; top: 12vw; left: 1vw; }
  main ul.slide a p { font-size: 5vw; }
  main .inner .in { width: 100%; }
  #worldmap { display: block; height: 113vw; }
  #worldmap + .caption { font-size: 3.3vw; }
  #worldmap .map { width: 100%; }
  #worldmap .right { width: 70%; margin: 1em auto 0; }
  #worldmap .right h3 { font-size: 3.5vw; }
  #worldmap .right h3 img { width: 2.59em; }
  #worldmap .right .url { font-size: 2.5vw; }
  main .detail { display: block; }
  main .detail table { margin-right: 0px; width: 100%; }
  main .detail table tr th { font-size: 3.5vw; width: 45%; }
  main .detail table tr td { font-size: 3.5vw; }
  main .detail table + p { font-size: 3.5vw; }
  #interview { background: url(../img/interview_bg_sp.jpg) center 0/cover no-repeat; margin: 5rem 0; padding: 5%; padding-top: 34%; padding-bottom: 26%; }
  #interview h3 { font-size: 6vw; }
  #interview h3 span { font-size: 5vw; }
  #interview h3 + p { font-size: 4vw; }
  #interview .btn_white { right: 8%; }
  #interview .btn_white a { font-size: 3.5vw; }
  #interview2 { background: url(../img/interview2_bg_sp.jpg) center 0/cover no-repeat; margin: 5rem 0; padding: 5%; padding-top: 34%; padding-bottom: 26%; }
  #interview2 h3 { font-size: 6vw; }
  #interview2 h3 span { font-size: 5vw; }
  #interview2 h3 + p { font-size: 4vw; }
  #interview2 .btn_white { right: 8%; }
  #interview2 .btn_white a { font-size: 3.5vw; }
  #interview3 { background: url(../img/interview3_bg_sp.jpg) center 0/cover no-repeat; margin: 5rem 0; padding: 5%; padding-top: 34%; padding-bottom: 26%; }
  #interview3 h3 { font-size: 6vw; }
  #interview3 h3 span { font-size: 5vw; }
  #interview3 h3 + p { font-size: 4vw; }
  #interview3 .btn_white { right: 8%; }
  #interview3 .btn_white a { font-size: 3.5vw; }
  #chalenge { background: url(../img/chalenge_bg_sp.jpg) 0 0/100% no-repeat; background-color: #f6f7f7; padding-bottom: 6rem; }
  #chalenge h3 { font-size: 6vw; padding: 2em 0 1.5em 0; }
  #chalenge .flex { display: block; padding-bottom: 8rem; }
  #chalenge .flex div { width: 100%; }
  #chalenge .flex div p { font-size: 3.8vw; line-height: 1.5; }
  #chalenge .flex div h4 { font-size: 5vw; }
  #chalenge .banner p { font-size: 4vw; }
  #chalenge .banner ul { display: block; }
  #chalenge .banner ul li { width: 60%; margin: 0 auto; }
  #history ul { padding: 5% 8vw; margin: 0px; }
  #history ul li p { font-size: 5vw; margin-top: 1em; }
  #history ul li:before { width: 3vw; height: 3vw; top: 74%; display: none; }
  #history ul li:after { top: 75.5%; width: 150%; left: -25%; display: none; }
  #history .slick-next { background: url(/common/img/btn_next.png) center center/contain no-repeat !important; width: 6vw; height: 6vw; right: 1vw; top: 50%; margin-top: -3vw; }
  #history .slick-prev { background: url(/common/img/btn_prev.png) center center/contain no-repeat !important; width: 6vw; height: 6vw; left: 1vw; top: 50%; margin-top: -3vw; }
  #history ul.left .slick-prev { left: 1vw; } }

/*# sourceMappingURL=about.css.map */
