@charset "utf-8";
/* -------------------------------------------
  Auther: design studio tom'sOne / Tommy Tsutsui / https://toms1.net/
  Issued in: 05/Jun/2024 / Last modefied: 05/Jun/2024
------------------------------------------- */

/* -------------------------------------------
  Reset
------------------------------------------- */
html{font-size:62.5%}body,a,address,header,html,iframe,nav{padding:0;margin:0}address,header,html,iframe,nav{border:0;outline:0}abbr,article,aside,audio,b,canvas,cite,code,del,details,dfn,em,fieldset,figcaption,figure,form,hgroup,i,img,ins,kbd,label,legend,mark,menu,object,pblockquote,pre,q,samp,span,strong,sub,summary,sup,time,var,video{background:0 0;margin:0;padding:0;border:0;outline:0}footer,h1,h2,h3,h4,h5,h6,p,section,small{border:0;outline:0}address,article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav,section{display:block}ul{list-style:none}blockquote,q{quotes:none}blockquote:after,blockquote:before,q:after,q:before{content:'';content:none}a img,figure{vertical-align:top}abbr[title],dfn[title]{cursor:help}input,select{vertical-align:middle}noscript{margin:0}

/* Mobile Device Hide Items */
#ANLanguage, #ANEntry, .ANInsta, #GNav, .HNMenuSign, .pageNamePlate { display: none;}

/* -------------------------------------------
  Fonts
------------------------------------------- */
body  {
  font-family: "Roboto", "Helvetica Neue", "Helvetica", "Arial", sans-serif;; font-optical-sizing: auto; font-style: normal}

.RB400, .ONItem, #mfp_phase_confirm td, .legalItem dd { font-weight: 400}

.RB500, .compLDD { font-weight: 500}

.RB600, #globalNav, .TECopy, .PTJP, .compLDT, .formProgress, #mfp_phase_confirm h4, #mfp_phase_confirm th,
.newsBody h2, .newsBody h3, .newsBody h4, .newsBody h5, .legalItem dt { font-weight: 600}

.RB700 { font-weight: 700}
.pageST { font-weight: 800}

.figtree, .FI400, .FI500, .FI600, .FI700, .FI800, .TECopy, .topST, .HNMenuSign, .ONItem em, .PTEn, .PNPName, .BMIST,
.TRAVELERSHNName, .AccHNName, .MBItem, .BBLink, .TNIndexBT, button, #mfp_phase_confirm_inner h4 {
  font-family: "Figtree", sans-serif; font-optical-sizing: auto; font-style: normal}

.FI400, .HNMenuSign, .NLTime, .newsTime { font-weight: 400}
.FI500, .ONItem em, button { font-weight: 500}
.FI600 { font-weight: 600}
.FI700, .TECopy, .topST, .PNPName, .BBLink, .TRAVELERSHNName, .AccHNName, #mfp_phase_confirm_inner h4 { font-weight: 700}
.FI800, .PTEn, .TNIndexBT { font-weight: 800}

.BPro, .BP400, .BP700 { font-family: "Libre Baskerville", serif}

.BP400 { font-weight: 400}
.BP700 { font-weight: 700}

/* -------------------------------------------
  Common
------------------------------------------- */
* {min-height: 0vw}

body {
  position: relative; color: #333; background: #fff; -webkit-text-size-adjust: 100%; font-size: 1rem;
  line-height: 1; width: 100%; height: 100%; z-index: 1}

.lazyload { opacity: 0} .lazyloaded { opacity: 1; -webkit-transition: all 0.5s; transition: all 0.5s}

.mag0 { margin: 0 !important} .mag20 { margin-top: 20px !important} .mag50 { margin-top: 50px !important}
.magLM02 { margin-left: -.25em !important} .magLM03 { margin-left: -.35em !important}
.pad01 { padding-top: 1em !important}

.ls0 { letter-spacing: 0 !important} .ls03 { letter-spacing: .03em !important}
.ls05 { letter-spacing: .05em !important} .ls10 { letter-spacing: .1em !important} .ls12 { letter-spacing: .125em !important}
.ls15 { letter-spacing: .15em !important} .ls20 { letter-spacing: .2em !important} .ls30 { letter-spacing: .3em !important}
.ls50 { letter-spacing: .5em !important} .ls100 { letter-spacing: 1em !important} .ls110 { letter-spacing: 1.1em !important}

.lsM01 { letter-spacing: -.01em !important} .lsM02 { letter-spacing: -.025em !important}
.lsM05 { letter-spacing: -.05em !important} .lsM07 { letter-spacing: -.075em !important} 
.lsM10 { letter-spacing: -.1em !important} .lsM15 { letter-spacing: -.15em !important}
.lsM20 { letter-spacing: -.2em !important} .lsM25 { letter-spacing: -.25em !important}
.lsM30 { letter-spacing: -.3em !important} .lsM40 { letter-spacing: -.4em !important} .lsM50 { letter-spacing: -.5em !important}

.lsW03 { margin: 0 3px !important}
.lsN01 { margin: 0 -1px !important} .lsN02 { margin: 0 -2px !important}
.lsEM02 { margin: 0 -.2em !important} .lsEM03 { margin: 0 -.35em !important}

.patent01 { font-size: 1.8rem; font-weight: 400; margin: 0 -3px 0 -1px; vertical-align: 15px}
.patent02 { color: #555; font-size: 2rem; font-weight: 400; margin-right: -2px; vertical-align: 5px}

.patentCopyright {
  font-size: 7px; font-weight: 400; letter-spacing: 0 !important; margin: 0 2px 0 1px; 
  display: inline-block; -webkit-transform: scaleX(.9); transform: scaleX(.9)}

figure img { width: 100% !important; height: auto; vertical-align: top}

@media (max-width: 767px) { .patent02 { color: #555; font-size: 2rem; font-weight: 300; margin-right: -2px} }
@media (min-width: 768px) { .patent02 {  margin-top: -6px; position: absolute; margin-left: -3px; font-size: 1.6rem} }

/* Common Image */
.homeLink, .ANlangSign, .FANlangSign, .ANInstaLink, .FNInstaLink, .botHomeLink, .appStore, .googlePlay, #ORLogo {
 background-image: url(../common_im/sp_common.svg); background-repeat: no-repeat; background-size: 178px 250px}

/* Flex Container
------------------------------------------- */
.flexC, #headNav, .ANList, .legalLinks, .BreadcrumbList, .NLTit, .formProgress, .mfp_buttons {
  display: -webkit-flex; display: flex; -webkit-justify-content: space-between; justify-content: space-between;
  -webkit-flex-flow: row wrap; flex-flow: row wrap}

.FNList { display: none}

/* Common Header
------------------------------------------- */
#globalHeader {
  position: absolute; top: 0; left: 0;
  width: 100%; height: 50px; margin: 0; -webkit-transition: all .6s; transition: all .6s}

.GHInner {
  background: rgba(255,255,255,.75); width: 100%; height: 100%; margin: 0 auto; position: relative; z-index: 100}

#homeLogo { position: fixed; top: 5px; left: 4vw; width: 178px; margin: 0; z-index: 9999}

.homeLink { background-position: 0 0; width: 178px; height: 40px; display: block; position: relative; opacity: 1}

.fixed #homeLogo { position: fixed; top: 18px; width: 130px; height: 10px}
.fixed .homeLink { background-position: 0 -50px; width: 130px; height: 10px}

#headNav {
  position: absolute; top: 12px; right: 60px; z-index: 999}

/* Action nav */
.ANList { margin: 0; padding: 0}

.ANItem, .FANItem, .COALogin, .FANLanguage { font-size: 1.5rem; margin: 0; display: block; position: relative}
.FANLanguage { width: 260px; margin: 25px auto 0; position: relative}
.COALogin { margin: 0}

.FANItem:first-of-type { margin-left: 18px}

#ANLogin { font-size: 1.3rem}

.ANLink, .FANLink {
  color: #333; text-decoration: none; letter-spacing: .05em; text-indent: .025em;
  margin: 0; padding: 5px 8px; position: relative; display: block}
.FANLink { padding: 8px 10px}

.ANlangBT {  padding: 8px 10px}
.FANlangBT { position: absolute; top: 0; right: 0; background: #666; color: #c2c2c2; width: 60px; padding: 10px 9px 10px 37px; display: block}
.FANlangBT { cursor: pointer; overflow: hidden}

.FANlangSign {
  position: absolute; top: 7px; left: 0; background-position: -220px -80px; width: 20px; height: 20px; display: block}
.FANlangSign { left: 12px; background-position: -150px -80px}

.FANLogin { color: #fff; background: #666; border-radius: 18px; position: relative}

.ANLoginBT, .ANEntryBT, .FANEntry, .FANlangBT { border-radius: 18px}
.ANLoginBT { border: 1px solid #444;}
.FANEntry { background: #d7d7d7; border: none}

.ANInsta { width: 25px; margin: 7px 0 0 5px}
.ANInstaLink { background-position: -220px -120px; width: 25px; height: 25px; display: block}

.FNInsta { width: 30px; height: 30px; margin: 0 0 0 37px; padding-top: 3px;}
.FNInstaLink { background-position: -140px -200px; width: 30px; height: 30px; display: block}

.ANInstaLink:hover, .FNInstaLink:hover { opacity: .7; -webkit-transform: translate(2px,-2px); transform: translate(2px,-2px)}

/* Language nav */
.FLangNav, .ANLangNav {
  position: absolute; bottom: 40px; right: -17px; background: rgba(0,0,0,.9);
  padding: 15px 40px; border: 1px solid #999; border-radius: 9px; z-index: 9980;
  -webkit-backdrop-filter: saturate(180%) blur(10px); backdrop-filter: saturate(180%) blur(10px)}

.ANLangNav { top: 40px; bottom: inherit; right: -29px}

#FLangList { color: #222; margin: 0; padding: 0}

.FLangItem { font-size: 1.6rem; text-align: center; letter-spacing: .075em; margin: 1em 0}

.FLangLink { color: #ccc; text-decoration: none;}

.FLangLink:hover { color: #4ebbcc}

/* Language Slide Effects */
.ANLSlide {
  visibility: hidden; -webkit-transform: translateY(30px); transform: translateY(30px); opacity: 0;
   -webkit-transition: all .3s ease-in-out .05s; transition: all .3s ease-in-out .05s}

.FNLSlide {
  visibility: hidden; -webkit-transform: translateX(30px); transform: translateX(30px); opacity: 0;
   -webkit-transition: all .3s ease-in-out .05s; transition: all .3s ease-in-out .05s}

.ANLSlide.open, .FNLSlide.open { visibility: visible; -webkit-transform: none; transform: none; opacity: 1}

/* Overlay Navi */
#trigger-overlay {
  position: fixed; top: 0; right: 0; text-decoration: none; width: 50px; height: 50px; display: block; z-index: 9999}

.HMBox { position: fixed; top: 16px; right: 0; width: 36px; height: 34px}

#trigger-overlay::before, #trigger-overlay::after {
  content: ''; position: absolute; top: 0; right: 0; width: 50px; height: 50px; display: block}
#trigger-overlay::before { background: rgba(46,80,130,.9); z-index: -2}
#trigger-overlay::after { background: rgba(0,150,160,.9); -webkit-transform: scale(0); transform: scale(0); z-index: -1}

#trigger-overlay.active::after { -webkit-transform: scale(1); transform: scale(1)}


.menu-trigger, .menu-trigger span { display: inline-block; box-sizing: border-box}

.menu-trigger, .menu-trigger .HMBar, .menu-trigger:after {
  -webkit-transition: all .4s cubic-bezier(.075, .82, .165, 1); transition: all .4s cubic-bezier(.075, .82, .165, 1)}

.menu-trigger .HMBar {
 background: #f0f0f0; width: 22px; height: 2px; display: block;  position: relative;
 -webkit-transition: all .7s cubic-bezier(.19, 1, .22, 1); transition: all .7s cubic-bezier(.19, 1, .22, 1);
 -webkit-transform-origin: right bottom; transform-origin: right bottom}

.menu-trigger .HMBar:nth-child(1) { -webkit-transition-delay: 150ms; transition-delay: 150ms}
.menu-trigger .HMBar:nth-child(2) { width: 12px; top: 6px; -webkit-transition-delay: .08s; transition-delay: .08s}
.menu-trigger .HMBar:nth-child(3) { width: 18px; top: 12px; -webkit-transition-delay: 0; transition-delay: 0}

.menu-trigger.active .HMBar { background: #fff53e}

.menu-trigger.active .HMBar:nth-child(1) {
 left: -3px; width: 22px; -webkit-transform: rotate(315deg); transform: rotate(315deg)}

.menu-trigger.active .HMBar:nth-child(2) {
 -webkit-transform: translate(-30px, 0); transform: translate(-30px, 0); opacity: 0}

.menu-trigger.active .HMBar:nth-child(3) {
 top: 12px; left: -4px; width: 22px; -webkit-transform: rotate(-315deg); transform: rotate(-315deg)}

.fixed #trigger-overlay::before, .fixed #trigger-overlay::after { width: 44px; height: 44px}
.fixed .HMBox { top: 14px; right: -3px}

/* Overlay */
.overlay {
  position: fixed; top: 0; right: 0; background: rgba(40,40,40,.9);
  width: 100%; height: 100vh; overflow: auto; z-index: 9980;
  -webkit-backdrop-filter: saturate(180%) blur(10px); backdrop-filter: saturate(180%) blur(10px)}

/* Overlay Effects */
.overlay-slidedown {
  visibility: hidden; -webkit-transform: translateX(110%) skewX(10deg); transform: translateX(110%) skewX(10deg);
  -webkit-transition: -webkit-transform .4s ease-in-out, visibility 0s .4s;
  transition: transform .4s ease-in-out, visibility 0s .4s}

.overlay-slidedown.open {
  visibility: visible; -webkit-transform: translateX(0%) skewX(0deg); transform: translateX(0%) skewX(0deg);
  -webkit-transition: -webkit-transform .4s ease-in-out; transition: transform .4s ease-in-out}

/* Overlay Menu */
#ORContainer {
  position: absolute; top: 50%; left: 50%; width: 92%; min-height: 330px; max-width: 360px; margin: 0 auto; padding: 4vw 0;
  -webkit-transform: translate(-50%,-50%); transform: translate(-50%,-50%)}

.ORNav { position: relative}

.overlayNav { margin: 0; padding: 0}

.ONItem { font-size: 1.6rem; text-align: center; letter-spacing: .12em; margin: 20px 0}
.ONItem:first-of-type { margin: 0}

.ONItem em { color: #b5b5b5; font-size: 1.4rem; font-style: normal; padding-top: 2px; float: right}

.ONCI { margin: 5px 0 0}

.ONKind { color: #f7dd99; padding: 0 15px 10px .6em; display: inline-block; position: relative}

.ONKind::after { content: ''; position: absolute; top: 50%; right: 0; background: #f7dd99; margin-top: -8px;
  width: 8px; height: calc(8px / 2 * tan(60deg)); display: inline-block; opacity: .65; clip-path: polygon(0 0, 100% 0, 50% 100%)}

.ONItem a {
  background: inherit; color: #e5e5e5; text-decoration: none; padding: 8px 8px 10px;
  position: relative; display: block; cursor: pointer; overflow: hidden}

.ORActionNav { width: 260px; margin: 30px auto 0}

.ORAppDownload { width: 300px; margin: 33px auto 0}

#ORLogo {
  background-position: 0 -60px; width: 148px; height: 24px; margin: 30px auto 0; opacity: .85}

.ORLegal { width: 270px; margin: 30px auto 0; padding: 0}
.ORLegal .LLItem { text-align: center; margin: 0 !important}


/* -------------------------------------------
 Footer
------------------------------------------- */
footer { background: #222; margin-top: 6px; padding: 50px 0 60px; position: relative; overflow: hidden; z-index: 1}

#footInner { margin: 0 auto}

/* Bottom ID */
.footLeft, .footRight { width: 100%}

#bottomID { width: 148px; margin: 0 auto; position: relative}

#botLogo { width: 148px; margin: 0}
#botLogo:hover { opacity: .7; -webkit-transform: translate(3px,-3px); transform: translate(3px,-3px)}

.botHomeLink { background-position: 0 -60px; width: 148px; height: 106px; display: block; cursor: pointer}

.footActionNavi { width: 240px; margin: 34px auto 0}

.appDownload { width: 280px; margin: 35px auto 0}

.ADBT { width: 128px; margin: 0}

.appStore, .googlePlay { width: 128px; height: 40px; display: block; cursor: pointer; overflow: hidden}
.appStore { background-position: 0 -170px}
.googlePlay { background-position: 0 -210px}

.appStore:hover, .googlePlay:hover { opacity: .6; -webkit-transform: translate(0, -2px); transform: translate(0, -2px)}

.FNList { margin: 0; padding: 0}

.FNItem { font-size: 1.5rem; letter-spacing: .06em; display: block}

.legalLinks { width: 250px; text-align: center; margin: 30px auto 0; padding: 0}

.LLItem { font-size: 1.4rem; letter-spacing: .06em; display: inline-block}

.LLLink { color: #ccc; text-decoration: none}

.FNLink, .LLLink { color: #c2c2c2; text-decoration: none; padding-bottom: 9px; display: block; position: relative; cursor: pointer; overflow: hidden}

#footAddress { margin-top: 48px}

#copyright { color: #c2c2c2; font-size: 1.4rem; text-align: center; letter-spacing: .04em; width: 100%; margin: 40px 0 0; display: block}

@media (min-width: 700px) {
  #footInner { padding: 0 5vw} .footLeft { width: 280px} .footRight { width: 340px}
  .legalLinks { margin-top: 10px} .FANLanguage { margin-top: 72px}
  #copyright { text-align: right; width: 280px; margin: 82px auto 0}
}

/* -------------------------------------------
  Return Button
------------------------------------------- */
#returnBT { position: fixed; bottom: 0; right: 0; margin: 0; z-index: 9999}

#retTop { margin: 0; position: relative}

#retTop::before, #retTop::after {
 content: ''; position: absolute; bottom: 0; left: 0; width: 100%; height: 100%; display: block;
 z-index: -1; -webkit-transform-origin: center; transform-origin: center}
#retTop::before { background: rgba(105,105,105,.85)}
#retTop::after { background: rgba(0,160,175,.9); -webkit-transform: scale(0); transform: scale(0)}
#retTop:hover::before { -webkit-transform: scale(0); transform: scale(0)}
#retTop:hover::after { -webkit-transform: scale(1); transform: scale(1)}

#retTop a { color: #fff; width:60px; height: 50px; margin: 0; text-indent: -9999px; position: relative}

#retTop a::before {
 content: 'page top'; position: absolute; bottom: 14px; left: 0; display: block; cursor: pointer; z-index: 1000;
 color: #fff; font-size: 11px; text-align: center; text-indent: .089em; letter-spacing: .08em; width: 100%}
#retTop a::after {
 content: ''; position: absolute; top: 14px; left: 50%; cursor: pointer;
 width: 6px; height: 6px; border-top: 1px solid #fff; border-right: 1px solid #fff; margin-left: -4px;
 -webkit-transform: rotate(-45deg); transform: rotate(-45deg)}


/* -------------------------------------------
 Banner Area
------------------------------------------- */
#mainBanner, #botomBanner { margin-top: 6px; padding-top: 6px; border-top: 1px solid #bbb}
#pageMainBanner { margin-top: 6px}

.MBItem { width: calc(50% - 3px); margin: 0; position: relative}
.BBItem { width: calc(33.33% - 4px); margin: 0; position: relative}

.MBLink, .BBLink { text-decoration: none; padding: 40px 0; display: block; cursor: pointer; overflow: hidden}
.BBLink { padding: 50px 0}

.MBLink::before, .BBLink::before{ content: ''; position: absolute; top: 0; height: 100%}
.MBLink::before, .BBLink::before { left: 0; width: 100%; z-index: -1}

.MBTRAVELERS::before { background: #eee}
.MBPartner::before { background: #444}

.BBQA::before { background: #555}
.BBCompany::before { background: #909090}
.BBContact::before { background: #f7f7f7; border: 1px solid #ccc; border-right: none}

.MBCopy, .BBCopy { text-align: center; margin: 0}

.MBSubCatch, .MBMainCatch, .MBENCopy, .BBEN, .BBJP { display: block}

.MBSubCatch { font-size: 1.6rem; letter-spacing: .035em;}
.MBTRAVELERS .MBSubCatch, .MBTRAVELERS .MBMainCatch { color: #333}
.MBPartner .MBSubCatch, .MBPartner .MBMainCatch { color: #e9e9e9}

.MBMainCatch { font-size: 3rem; letter-spacing: .025em}

.MBENCopy { font-size: 2rem; font-style: normal; letter-spacing: .075em; margin-top: 18px}
.MBTRAVELERS .MBENCopy { color: #f96600}
.MBPartner .MBENCopy { color: #aed7f5}

.BBEN { font-size: 2.8rem; letter-spacing: .025em; }

.BBQA .BBEN, .BBQA .BBJP { color: #e9e9e9} 
.BBCompany .BBEN, .BBCompany .BBJP { color: #fff} 
.BBContact .BBEN, .BBContact .BBJP { color: #444} 

.MBCurrent { opacity: .6; cursor: default}
.MBTRAVELERS.MBCurrent::before { background: #888}
.MBCurrent::after { display: none}

.MBCurrent.MBTRAVELERS:hover .MBSubCatch, .MBCurrent.MBTRAVELERS:hover .MBMainCatch { color: inherit}

@media (max-width: 700px) { .MBItem { width: 100%} .MBLink { padding: 35px 0} }

@media (max-width: 639px) { .BBItem { width: 100%;} .BBLink { padding: 35px 0} }

/* -------------------------------------------
 Main Container
------------------------------------------- */
/* Container
------------------------------------------- */
#topStage, #stage { background: transparent; position: relative; overflow: hidden}
#stage { padding-top: 50px; border-top: 1px solid #bbb;}
#stage::before { content: ''; position: absolute; top: 49px; left: 0; background: #bbb; width: 100vw; height: 1px}

#pageHead {margin: 0 auto; position: relative}

.PTWrapp, .PTWrapp02 { order: 2; width: 100%; padding: max(9vw,45px) 4vw max(11vw,60px)}

.pageWrapp { width: 100%; margin: 0; border-top: 1px solid #bbb; border-bottom: 1px solid #bbb}

.pageNamePlate { width: 69px; padding-top: 35px; border-right: 1px solid #bbb}

.PNPName { color: #555; font-size: 2rem; writing-mode: vertical-rl; text-align: center; letter-spacing: .1em; margin: 0 auto;}

.pageContents { width: 100%; overflow: hidden}

.pageWrapp01, .pageWrapp02 { padding: 50px 4vw; position: relative}
.pageWrapp01 { padding: 50px 4vw; border-top: 1px solid #bbb}
.pageWrapp01.spPW01 { padding-bottom: 30px}

.pageSec { margin: 0 auto; position: relative}

.MG0 { margin-top: 0 !important} .MG01 { margin-top: 1em !important} .MG20 { margin-top: 20px !important}
.MG30 { margin-top: 30px !important} .MG40 { margin-top: 40px !important} .MG50 { margin-top: 50px !important}
.MG60 { margin-top: 60px !important} .MG70 { margin-top: 70px !important} .MG80 { margin-top: 80px !important}
.MG90 { margin-top: 90px !important} .MG100 { margin-top: 100px !important}


/* Breadcrum Navi
------------------------------------------- */
.breadcrumb { width: 100%; border-top: 1px solid #bbb}

.BreadcrumbNav { margin: 0 auto; padding: 0; position: relative}

.BreadcrumbList { justify-content: flex-end; margin: 0; padding: 14px 5vw 10px}

.BCLink, .BCCurrent { font-size: 1.2rem; line-height: 1.6; letter-spacing: .05em; padding: 0; display: inline-block;}

.BCLink { position: relative}

.BLSign { content: ">"; color: #666; font-size: 1.2rem; text-align: center; width: 1.6em; margin-top: -3px; display: inline-block}

.BreadcrumbList a {
  color: #333; text-decoration: none; border-bottom: 1px solid #7eaebb;
  display: inline-block; position: relative}

.BreadcrumbList a:hover { color: #39b; border: none}


/* Page Eyecatch
------------------------------------------- */
.pageEC { order: 1; background-repeat: no-repeat; width: 100%; height: 75vw; max-height: 500px; position: relative; z-index: 1}

#travelresEC { background: url(../travelers/images/eyecatch02.webp) no-repeat center / cover}
#accomodationEC { background: url(../partnership/images/eyecatch02.webp) no-repeat center / cover}

.no-webp #travelresEC { background: url(../travelers/images/eyecatch02.jpg) no-repeat center / cover}
.no-webp #accomodationEC { background: url(../partnership/images/eyecatch02.jpg) no-repeat center / cover}


/* Page Titles
------------------------------------------- */
.pageTitle { margin: 0}

.officialPTitle { margin: 3vw 0 3.25vw}

.PTEn { font-size: clamp(4rem, 7.5vw, 4.5rem); letter-spacing: .02em; font-style: normal; margin-top: 10px; display: block}
.PTEn.officialPT { font-size: clamp(3.6rem, 5vw, 4.2rem); margin-top: 12px}

#travelersPTE, .officialPT { color: #f96600}
#accPTE { color: #2e4e7e; letter-spacing: .02em}

.PTJP { font-size: clamp(3.6rem, 6.2vw, 4.5rem); letter-spacing: .04em; margin-top: 2%; display: block}

.officialPTitle .PTJP { font-size: clamp(3.4rem, 5vw, 4.2rem); margin-top: 5%}

.pageST { margin: 0; padding: 10px 10px 14px 10px; display: inline-block; position: relative}

.pageST::before, .pageST::after { content: ''; position: absolute; width: .8rem; height: .8rem}
.pageST::before { top: 0; left: 0; border-top: #f1352b solid .3rem; border-left: #f1352b solid .3rem; border-radius: .2rem 0 0 0}
.pageST::after { bottom: 0; right: 0; border-bottom: #f1352b solid .3rem; border-right: #f1352b solid .3rem; border-radius: 0 0 .2rem 0}

/* Sub Titles
------------------------------------------- */
.pageST { font-size: clamp(2.2rem,7vw,3rem); line-height: 1.4; letter-spacing: .035em; margin: 0}

.PSTEn { color: #f96600; font-size: 1.6rem; font-style: normal; letter-spacing: .08em; margin: 14px 0 0 1px; display: block}

.st18, .st20, .st22, .NTLST, .MDHST, .MDHST02 { letter-spacing: .06em; margin: 0}
.st18 { font-size: 1.8rem}
.st20 { font-size: 2rem}
.st22, .NTLST { font-size: 2.2rem}

.NTLST { margin-top: 45px}

.stCenter, .PCopyCenter { text-align: center}

@media (max-width: 799px) { .pageST { font-size: clamp(2.2rem,6.4vw,2.8rem)}}

/* Page Copy
------------------------------------------- */
.PCopy22 { font-size: clamp(1.7rem,3vw,2.2rem); line-height: 1.75; letter-spacing: .05em}

.PTTPad01 { margin: 0; padding-top: 1em !important}

.PTTPad10 { margin: 0; padding-top: 10px !important}
.PTTPad20 { margin: 0; padding-top: 20px !important}
.PTTPad25 { margin: 0; padding-top: 20px !important}
.PTTPad30 { margin: 0; padding-top: 20px !important}
.PTTPad40 { margin: 0; padding-top: 25px !important}
.PTTPad50 { margin: 0; padding-top: 35px !important}
.PTTPad60 { margin: 0; padding-top: 45px !important}

.topPatP, .pagePadP01, .pagePadP02 {
  color: #f96200; font-size: 3.6vw; text-align: right; letter-spacing: .1em; width: 100%; margin-top: 20px; display: block}
.pagePadP01, .pagePadP02 { margin-top: 30px}

@media (min-width: 700px) { .topPatP, .pagePadP01, .pagePadP02 { font-size: 2.4rem} }
/* -------------------------------------------
 Loader
------------------------------------------- */
#tp-loader { position: fixed; top: 0; left: 0; background: #e2e2e2; width: 100vw; height: 100vh; z-index: 100}
 
#loader {
 position: absolute; top: 50%; left: 50%; color: #fff; text-align: center;
 width: 200px; margin: 15px 0 0 -100px; z-index: 101}

@-webkit-keyframes loader { 0% { -webkit-transform: rotate(0deg); } 100% { -webkit-transform: rotate(360deg)}}
@keyframes loader { 0% { transform: rotate(0deg); } 100% { transform: rotate(360deg); }}

.loader {
 width: 3rem; height: 3rem; display: inline-block; vertical-align: middle;
 border: solid .25rem #f5f5f5; border-top-color: #ff6347; border-left-color: #ff6347;
 -webkit-border-radius: 50%; border-radius: 50%;
 -webkit-animation: loader 750ms linear infinite; animation: loader 750ms linear infinite}

 /* -------------------------------------------
 Slider Revolution
------------------------------------------- */
.tp-static-layers{position:absolute;z-index:505;top:0;left:0}.tp-caption.tp-hidden-caption,.tp-hide-revslider{visibility:hidden!important;display:none!important}.tp-caption{z-index:1;white-space:nowrap}.tp-caption-demo .tp-caption{position:relative!important;display:inline-block;margin-bottom:10px;margin-right:20px!important}.tp-simpleresponsive .caption,.tp-simpleresponsive .tp-caption{position:absolute;visibility:hidden;-webkit-font-smoothing:antialiased!important}.tp-simpleresponsive img{max-width:none}.tpclear{clear:both}.tp-bullets{z-index:1000;position:absolute;opacity:1;-webkit-transition:opacity .2s ease-out;transition:opacity .2s ease-out;-webkit-transform:translateZ(5px);transform:translateZ(5px)}.tp-bullets.hidebullets{opacity:0}.tp-bullets.simplebullets.round{height:21px}.tp-bullets.simplebullets.round .bullet{cursor:pointer;position:relative!important;background:rgba(0,0,0,.5)!important;-webkit-box-shadow:none;-moz-box-shadow:none;box-shadow:none;width:5px!important;height:5px!important;border:8px solid transparent!important;display:inline-block;margin-right:5px!important;margin-bottom:0!important;-webkit-transition:background-color .2s,border-color .2s;transition:background-color .2s,border-color .2s;float:none!important;box-sizing:content-box;-moz-box-sizing:content-box;-webkit-box-sizing:content-box}.tp-bullets.simplebullets.round .bullet.last{margin-right:0}.tp-bullets.simplebullets.round .bullet.selected,.tp-bullets.simplebullets.round .bullet:hover{-webkit-box-shadow:none;-moz-box-shadow:none;box-shadow:none;background:#666!important;width:5px!important;height:5px!important;border:8px solid rgba(255,255,255,1)!important}.tparrows{opacity:1;-webkit-transition:opacity .2s ease-out;transition:opacity .2s ease-out;-webkit-transform:translateZ(5000px);transform:translateZ(5000px);-webkit-transform-style:flat;transform-style:flat;-webkit-backface-visibility:hidden;backface-visibility:hidden;z-index:600;position:relative}.tp-leftarrow.default,.tp-rightarrow.default{z-index:100;cursor:pointer;position:relative;width:40px;height:40px}.tparrows.hidearrows{opacity:0}.tp-leftarrow.default{background:url(assets/large_left.png)}.tp-rightarrow.default{background:url(assets/large_right.png)}.tp-leftarrow:hover,.tp-rightarrow:hover{background-position:bottom left}.tp-bannertimer{width:100%;height:5px;background:url(assets/timer.png);position:absolute;z-index:200;top:0}.tp-bannertimer.tp-bottom{bottom:0;height:5px;top:auto}@media only screen and (min-width:0px) and (max-width:479px){.responsive .tp-bullets,.responsive .tparrows{display:none}}.tp-loader{top:50%;left:50%;margin-top: 51px !important;z-index:100;position:absolute}.tp-loader.spinner3{margin:-9px 0 0 -35px;width:70px;text-align:center}.tp-loader.spinner3 .bounce1,.tp-loader.spinner3 .bounce2,.tp-loader.spinner3 .bounce3{width:18px;height:18px;background-color:#fff;box-shadow:0 0 20px 0 rgba(0,0,0,.15);-webkit-box-shadow:0 0 20px 0 rgba(0,0,0,.15);border-radius:100%;display:inline-block;-webkit-animation:tp-bouncedelay 1.4s infinite ease-in-out;animation:tp-bouncedelay 1.4s infinite ease-in-out;-webkit-animation-fill-mode:both;animation-fill-mode:both}.tp-loader.spinner3 .bounce1{-webkit-animation-delay:-.32s;animation-delay:-.32s}.tp-loader.spinner3 .bounce2{-webkit-animation-delay:-.16s;animation-delay:-.16s}@-webkit-keyframes tp-bouncedelay{0%,100%,80%{-webkit-transform:scale(0)}40%{-webkit-transform:scale(1)}}@keyframes tp-bouncedelay{0%,100%,80%{transform:scale(0);-webkit-transform:scale(0)}40%{transform:scale(1);-webkit-transform:scale(1)}}

/* BANNER CONTAINERS */
.tp-banner-container, .tp-banner { width: 100%; height: 700px; position: relative; overflow: hidden}
.tp-banner-container { position: relative}

.tp-banner-container, .tp-banner-fullscreen-container { padding:0}

.tp-banner ul { margin: 0; padding: 0}

.tp-leftarrow.default, .tp-rightarrow.default { margin-top: 0 !important}

.tp-bullets { bottom: 30px !important}


/* -------------------------------------------
 Top Page
------------------------------------------- */
.THFTImage, .SFTBadSign {
  background: url(../top_im/top02.svg) no-repeat 0 0 / 294px 532px}

.topST { font-size: 3.4rem; letter-spacing: .02em; margin: 0}

.TSEN { color: #777; font-size: 1.6rem; font-style: normal; letter-spacing: .07em; margin-top: 8px; display: block}

#ourStrengths, #topMedSubject, #searchProblem { max-width: calc(1340px - 10vw); margin: 0 auto; padding: 70px 5vw}
#ourStrengths { padding-bottom: 10px}

/* Top Banner */
#topEyecatch { background: #bbb; height: 700px; position: relative}

#topSlide { width: 100%; margin: 0 auto; overflow: hidden}

#topSlider { width: 100%; height: 700px; position: relative}

.TECopy {
  position: absolute; color: #333; font-size: 3.7rem; letter-spacing: .025em; width: 100%; margin: 0; z-index: 15}

.TECopyNew01, .TECopyNew02 { text-align: center; letter-spacing: 0}
.TECopyNew01 { top: 115px; font-size: 13vw !important; text-shadow: -2px -2px 1px rgba(255,255,255,1)}
.TECopyNew02 { top: 210px; font-size: 5.5vw !important; text-shadow: -1px -1px 1px rgba(255,255,255,1)}

.TECopy03, .TECopy33, .TECopy04, .TECopy44 { left: 6vw; color: #fff; text-shadow: 0 0 5px rgba(0,0,0,.9)}
.TECopy04, .TECopy44 { top: 370px}
.TECopy33, .TECopy44 { color: #333; text-shadow: none}

.TECopy33, .TECopy44 {
  text-shadow: 0 0 3px rgba(255,255,255,1), 0 0 3px rgba(255,255,255,1),
  -1px -1px 2px rgba(255,255,255,1), 1px 1px 2px rgba(255,255,255,1), 1px 1px 3px rgba(255,255,255,1)}

.TECopy03, .TECopy05, .TECopy33 { top: 380px; left: 6vw}
#TESuper02, .TECopy04, .TECopy44 { top: 420px}

#TESuper05 { top: 408px}
.TECopy05, .TECopy06, .TECopy07 { left: 6vw; color: #000;
  text-shadow: 1px 1px 1px rgba(255,255,255,.95), 1px 1px 1px rgba(255,255,255,.95), 0 0 3px rgba(255,255,255,.95), 0 0 3px rgba(255,255,255,.95),
  0 0 3px rgba(255,255,255,.95), 0 0 3px rgba(255,255,255,.95)}

@media (max-width: 560px) { #TP02 .TECopy04 { width: 340px; white-space: wrap; line-height: 8vw} }
@media (max-width: 520px)  {#TP02 .TECopy04 { line-height: 8.5vw} }
@media (max-width: 480px)  {#TP02 .TECopy04 { line-height: 9vw} }
@media (max-width: 450px)  {#TP02 .TECopy04 { top: 418px} }
@media (max-width: 429px)  {#TP02 .TECopy04 { top: 417px} }
@media (max-width: 410px)  {#TP02 .TECopy04 { top: 416px} }
@media (max-width: 400px)  {#TP02 .TECopy04 { top: 415px} }
@media (max-width: 380px)  {#TP02 .TECopy04 { top: 414px} }
@media (max-width: 370px)  {#TP02 .TECopy04 { top: 412px} }

#TESuper01 .tp-splitted:nth-of-type(4) { font-size: 5vw; font-weight: 400; vertical-align: 5.2vw}
#TESuper02 .tp-splitted:nth-of-type(4) { font-size: 2.5rem; font-weight: 400; margin-right: -3px; vertical-align: 16px}

.TESup01, .TESup02 { display: inline-block;}
.TESup01 { font-size: clamp(1.1rem,5.75vw,2.8rem) !important; -webkit-transform: translateY(-34px); transform: translateY(-34px)}
.TESup02 { font-size: clamp(1.1rem,5vw,2.2rem) !important; font-weight: 600; -webkit-transform: translateY(-15px); transform: translateY(-15px)}

#TEiPone, #TEiWAtch { left: 50%; position: absolute}
#TEiPone { top: 240px; background: url(../top_im/iphone.png) no-repeat 0 0 / cover; width: 230px; height: 410px; margin-left: -240px}
#TEiWAtch { top: 310px; background: url(../top_im/iwatch.png) no-repeat 0 0 / cover; width: 220px; height: 300px; margin-left: 50px}

@media (min-width: 768px) {
  .TECopyNew01, .TECopyNew02 { left: 50%; width: auto; display: inline-block}
  .TECopyNew01 { top: 90px; margin-left: -250px} .TECopyNew02 { top: 132px; margin: 0} }

@media (min-width: 480px) {
  .TECopyNew01 { font-size: 6.4rem !important} .TECopyNew02 { font-size: 2.5rem !important}
  #TESuper01 .tp-splitted:nth-of-type(4) { font-size: 2.8rem !important; vertical-align: 35px} }

@media (max-width: 767px) { #TEiPone { top: 265px} #TEiWAtch { top: 340px} }
@media (max-width: 600px) { #TEiPone { margin-left: -220px} #TEiWAtch { margin-left: 20px} }
@media (max-width: 660px) { .TECopy05 { width: 8em} }
@media (max-width: 640px) { .TECopy06 { top: 140px} .TECopy07 { top: 190px;}}
@media (max-width: 480px) { #TEiPone { margin-left: -210px}  #TEiWAtch { margin-left: 5px} }
@media (max-width: 479px) { .TECopyNew02 { top: calc(160px + 5vw)} }
@media (max-width: 459px) { .TECopy { font-size: 8.25vw} #TESuper02 .tp-splitted:nth-of-type(4) { font-size: 1.9rem; vertical-align: 16px} }
@media (max-width: 409px) { #TESuper02 .TECopy04 { top: 355px} }
@media (max-width: 399px) { #TEiPone { margin-left: -200px}  #TEiWAtch { margin-left: 0} }


/* Top Contents */
.TCInner { padding: 45px 0}

#topSoFarTravel { border-bottom: 1px solid #bbb}

.TCWrapp { max-width: 1060px; margin: 0 auto; padding: 0 5%; position: relative}

.topST { font-size: clamp(3rem,5vw,3.8rem); margin: 0}

#topST01 { padding-right: 14px}

#topST02 .onChar9, #topST02 .onChar21 { margin-right: -4px}
#topST02 .onChar11 { width: 5px}
#topST02 { padding: 7px 10px 7px 10px;}

.topCatch01 { position: absolute; top: 0; right: 2.5%; font-size: 5.4rem; margin: 0}
.topCatch02, .topCatch03 { color: #f96200; font-size: 5.8vw; text-align: center; margin: 50px 0 0}

.topCatch01 .onChar7, .topCatch01 .onChar12, .topCatch02 .onChar10, .topCatch02 .onChar13, .topCatch02 .onChar25 { width: 10px}
.spNTC01 .onChar10, .spNTC02 .onChar16 { width: 7px}
.topCatch02 .onChar33, .spNTC02 .onChar24 { -webkit-transform: rotate(15deg); transform: rotate(15deg)}
.topCatch03 { text-align: left; width: 81.33vw; margin: 30px auto 0}
.spNTC01, .spNTC02 { font-size: 7.5vw; white-space: nowrap; display: block} .spNTC02 { margin-top: 7px;}

.SFTravelCopy { font-size: 2.3rem; letter-spacing: .04em; margin: 50px 0 0}

.SFTravelImage { margin-top: 40px; position: relative}

#THFTravelWrapp { width: 100%; max-width: 700px; margin: 0 auto; position: relative}

.THFTAroww {
  position: absolute; top: 50%; left: 50%; background: url(../top_im/top_arrow.svg) no-repeat 0 0 / 586px 500px;
  width: 586px; height: 500px; margin: -230px 0 0 -260px; display: block}

.THFTItem { height: 220px; margin-top: 40px; position: relative}
#THFTItem03 { height: 230px} #THFTItem04 { height: 200px}

.THFTST { font-size: 2rem; line-height: 1.5; letter-spacing: .04em; margin: 0}

.THFTSM { font-size: 1.6rem; margin-left: 1em}
.THFTSM::before { content: "*"; color: #e44; font-size: 2.2rem; font-weight: 500; vertical-align: -.2em}

.THFTCatch03, .THFTCatch04 { position: absolute; left: 170px; font-size: 1.6rem; letter-spacing: .05em; white-space: nowrap; margin: 0; z-index: 5}
.THFTCatch03 { top: -5px} .THFTCatch04 { top: 20px}

#THFTItem03 .spNBlock { display: block}

.THFTImage { width: 294px}

#THFTI01 { position: absolute; top: 25px; left: 0; height: 196px}
#THFTI02 { background-position: 0 -210px; height: 163px; margin: 20px auto 0}
#THFTI03 { background-position: 0 -378px; height: 154px; margin-top: 15px}
#THFTI04 { height: 182px; margin-top: 18px; display: block}
#THFTI04 img { width: 100%; height: auto}

@media (min-width: 480px) and (max-width: 699px) {
  #topST02 { text-align: center; display: block; width: 10.1em; margin: 0 auto} }

@media (max-width: 699px) {
  #topHFTravel { padding-bottom: 8.5vw} .topCatch02 { margin-top: 6vw}
  .THFTList { display: block} #ArrowAnim { display: none} .THFTItem { width: 338px; margin: 40px auto 0; padding-bottom: 20px}
  .THFTItem::after {
    content: ''; position: absolute; bottom: -25px; left: 50%; background: #f27700;
    width: 30px; height: 26px; clip-path: polygon(50% 100%,0 0,100% 0); margin-left: -15px; display: block}
  .THFTItem:last-of-type::after { display: none} .THFTImage { margin: 0 auto}
  #THFTItem01 { height: 290px; margin-top: 30px} #THFTItem02 { height: 230px; margin-top: 30px}
  #THFTItem03 { height: 255px; margin-top: 30px}#THFTItem04 { margin-top: 30px; padding: 0}
  #THFTI01 {
    top: inherit; left: inherit; background: url(../top_im/sp_reserve.svg) no-repeat 0 0 / 250px 232px;
    width: 250px; height: 232px; position: relative} #THFTI02, #THFTI04 { margin-top: 15px} }

@media (max-width: 480px) {
  .topCatch02 .spNBlock { display: block} .topPatP, .pagePadP01, .pagePadP02 { font-size: 1.8rem; font-weight: 800 !important} }

@media (max-width: 380px) { .THFTSM { margin: 0; display: block} #THFTItem01 { height: 290px} .THFTCatch03, .THFTCatch04 { left: 160px} }

@media (max-width: 375px) {.THFTST { font-size: 1.9rem} .THFTItem { width: 324px} }

@media (min-width: 700px) {
  .THFTItem { height: 250px} #THFTItem04 { margin-top: 56px}
  #THFTI01 { top: 45px} #THFTI02 { margin-top: 20px} #THFTI03 { margin-top: 50px} .topCatch02 { font-size: 4rem}
  .THFTSM { margin: 0; display: block; position: relative; z-index: 10} .THFTCatch03, .THFTCatch04 { left: 140px}
  #ArrowAnim { -webkit-transform: scale(.78) translate(-57%, -62%) !important; transform: scale(.78) translate(-57%, -62%) !important} }

/* Top News */
#topNews { margin-top: 6px; padding: 6px 5% 0; border-top: 1px solid #bbb}

.TNewsBlock { align-items: center; margin: 0 auto; padding: 40px 0}

.TNewsHead { width: 160px; min-height: 90px; position: relative}

.TNewsST { font-size: 3rem; margin: 0}
.TNSTEN { color: #999; font-size: 1.5rem; font-style: normal; letter-spacing: .1em; margin: 10px 0 0 1px; display: block}

.TNewsNav { width: calc(100% - 160px - 4vw)}

.TNNList { margin: 0; padding: 0; border-bottom: 1px solid #bbb}

.TNNItem { font-size: 1.5rem; letter-spacing: .06em; margin: 0; border-top: 1px solid #bbb}
.TNNItem::after { clear: both}

.TNNTime { float: right}

.TNNLink { color: #333; text-decoration: none; padding: 18px; display: block; position: relative; cursor: pointer; overflow: hidden}
.TNNLink:hover { color: #005970; -webkit-transform: translate(1px,-1px); transform: translate(1px,-1px)}

.TNNLink::after {
  content: ''; position: absolute; top: 0; left: 0; right: auto;
  background: #aed7e2; width: 0; height: 100%; display: block; z-index: -1}
.TNNLink:hover::after { width: 100%;}

.TNIndexBT { position: absolute; bottom: 0; left: 0; font-size: 1.6rem; letter-spacing: .05em; text-indent: .02em; margin: 0}

.TNILink {
  color: #555; text-decoration: none; padding: 12px 15px 11px; border: 1px solid #a7a7a7;
  display: block; cursor: pointer; overflow: hidden}
.TNILink:hover { color: #fff; border-color: transparent; -webkit-transform: translateY(-2px); transform: translateY(-2px)}

.TNILink::after {
  content: ''; position: absolute; top: 0; left: 0; right: auto;
  background: #0099a2; width: 0; height: 100%; display: block; z-index: -1}
.TNILink:hover::after { width: 100%}

@media (max-width: 767px) {
  .TNewsHead { width: 100%; min-height: auto;} .TNIndexBT { bottom: -4px; left: inherit; right: 0; font-size: 1.4rem} .TNewsNav { width: 100%; margin-top: 30px} }

@media (max-width: 599px) {
  .TNewsBlock { padding: 40px 0} .TNNTime { float: none; color: #777; font-size: 1.3rem; margin-top: 9px; display: block} }

/* -------------------------------------------
 TRAVELERS
------------------------------------------- */
#travelersPTE .onChar8 { width: 13px}

#travelersHeadCopy, #BPartnerHeadCopy { font-size: clamp(2.4rem, 5vw, 2.8rem); line-height: 1.35; letter-spacing: .04em; margin: 30px 0 0}

#travPTJP .onChar8, #accPTJP .onChar8 { font-size: clamp(1.4rem, 5vw, 2.4rem); font-weight: 300; margin: 0 -2px 0 -1px; vertical-align: 17px}
#accPTJP .onChar8 { margin-right: -4px; vertical-align: 17px}
#travelersHeadCopy .onChar12 { font-size: clamp(1.4rem, 4.5vw, 2.8rem); font-weight: 300; vertical-align: 60%}

#travelersHeadNav, #AccHeadNav { background: #eee; padding: 30px 4vw 35px; position: relative}

.travelersHNKind, .AccHNKind { text-align: center}

.TRAVELERSHNName, .AccHNName { font-size: clamp(1.8rem,4.5vw, 2.1rem); letter-spacing: .05em; margin: 0}

.THNBT { font-size: clamp(1.8rem, 4.5vw, 1.9rem); letter-spacing: .075em; width: 90%; margin: 22px auto 0}
.AccHNKind .THNBT { width: 280px}

.THNLink {
  color: #fff; text-decoration: none; padding: 14px 0 16px; border-radius: 9px; display: block;
  position: relative; z-index: 1; cursor: pointer; overflow: hidden}

.THNLink::before, .THNLink::after { content: ''; position: absolute; top: 0; left: 0; height: 100%; border-radius: 9px}

.THNLink::before { background: #2e4e7e; width: 100%; z-index: -2}
.THNLink::after { right: auto; background: #0099a2; width: 0; z-index: -1}
.THNLink:hover::after { width: 100%}

#travelCaseST { padding-bottom: 10px}

#travelCaseST .onChar7, #spTCST01 .onChar7, #spTCST02 .onChar7, #travelCaseST .onChar12, #spTCST02 .onChar12,
#spTCST01 .onChar12, #travelCaseST .onChar20, #travelCaseST .onChar23, #travelCaseST .onChar28, #BMeritST .onChar8 { width: 8px}

@media (min-width: 690px) { #accPTJP .onChar8 { vertical-align: 22px; margin-right: -6px;} }
@media (min-width: 700px) {
  .travelersHNKind { width: 46.5%}
  .THNBT { width: 100%}
  #travelersHeadNav::after {
    content: ''; position: absolute; top: 20px; left: 50%; background: #fff; width: 2px; height: calc(100% - 40px); margin-left: -1px} }

@media (max-width: 699px) {
  #travelersHeadNav, #AccHeadNav { display: block !important}
  .travelersHNKind:nth-of-type(2) { margin-top: 30px; padding-top: 25px; border-top: 1px solid #bbb} }

@media (max-width: 599px) { #BMeritST .onChar8 { font-size: 1.8rem; margin-left: -1px}}
@media (max-width: 500px) {
  #spTravelCaseST { width: 8.25em; padding: 8px 1px 3px 12px; display: block} #spTravelCaseST .letAnim2 { display: block} }
@media (max-width: 420px) { #travelersHeadCopy br { display: none} }
@media (max-width: 399px) { #travelCaseST { font-size: 2.6rem} }

/* Travel Case */
.TCaseWrapp { margin-top: 18px}

.TCGCopy, .TCGCopy02 { font-size: 1.7rem; font-weight: 600; line-height: 1.7; margin: 10px 0 0}
.TCGCopy02 { margin-top: 15px}

.TCaseRight {
  display: -webkit-flex; display: flex; -webkit-justify-content: space-between; justify-content: space-between;
  width: 100%; max-width: 760px; margin: 50px auto 0; position: relative}

.travelCaseIM { text-align: center; width: 48.5%; position: relative; z-index: 1}
#TCaseIM01 { margin-top: 98px}
#TCaseIM02 { padding-top: 98px}

.TCaseCatch {
  position: absolute; top: 0; font-size: 3.5rem; text-shadow: -2px 1px 0 rgb(255,255,255); line-height: .9; margin: 0}
.TCC01 { left: 12vw}
.TCC02 { color: #f96200; left: 11vw}

.TCaseCatch::before {
  content: ''; position: absolute; top: -20px; left: -2em; width: calc(100% + 2.5em); height: calc(100% + 40px); display: block; z-index: -2}
.TCC01::before { background: #e9e9e9}
.TCC02::before { background: #ffefe0; left: -2em;}

.TCasePatent { font-size: 2rem; font-weight: 400; margin-right: 2px; vertical-align: 21px}

.TCCBlock { margin: 0 0 7px -1.45em; display: block}
.TCC02 .TCCBlock { margin-left: -6em}

.TCaseBG {
  position: absolute; bottom: 0; left: 50%; background: #ffefe0; width: 50vw; height: 25vw; margin-left: -25vw; display: block; z-index: -1}

.TCIItem { width: 80%; max-width: 300px; display: block;}
.TCIItem img { width: 100%; height: auto}

#TCIM01 { -webkit-transform: rotate(-3deg); transform: rotate(-3deg); margin-left: 15%; z-index: 3}
#TCIM02 { -webkit-transform: rotate(2deg); transform: rotate(2deg); margin-left: 5%; z-index: 3}

#TCIM05 { -webkit-transform: rotate(3deg); transform: rotate(3deg); margin-left: 18%; z-index: 3}
#TCIM08 { -webkit-transform: rotate(-2deg); transform: rotate(-2deg); margin-left: 5%}

@media (max-width: 640px) { .TCaseCatch { font-size: 3rem} #TCaseIM01 { margin-top: 82px} #TCaseIM02 { padding-top: 82px} }
@media (max-width: 540px) {
  .TCaseRight { max-width: 400px; display: block} .travelCaseIM { width: 100%} #TCaseIM02 { margin-top: 50px} .TCaseCatch { left: 13vw}
  #TCIM02, #TCIM08 { margin-top: -15px} #TCIM01 { margin-left: 20%} .TCaseBG { left: inherit; right: 0; width: 50vw; height: 33vw; margin: 0} }

 @media (max-width: 480px) { .TCaseCatch { left: 17vw} .TCaseBG { height: 45vw} }
 @media (max-width: 440px) { #TCIM01, #TCIM05 { margin-left: 15%}}
 @media (max-width: 415px) { #TCIM01, #TCIM05 { margin-left: 14%}}
 @media (max-width: 410px) { .TCaseCatch { left: 19vw} }

@-webkit-keyframes TCIMRota01 {0%,30%{-webkit-transform: rotate(27deg)} 100%{-webkit-transform: rotate(-3deg)}}
@keyframes TCIMRota01 {0%,30%{transform: rotate(27deg)} 100%{transform: rotate(-3deg)}}
.TCIMRota01 { -webkit-animation: TCIMRota01 .5s ease-in-out; animation: TCIMRota01 .5s ease-in-out}

@-webkit-keyframes TCIMRota03 {0%,30%{-webkit-transform: rotate(28deg)} 100%{-webkit-transform: rotate(2deg)}}
@keyframes TCIMRota03 {0%,30%{transform: rotate(28deg)} 100%{transform: rotate(2eg)}}
.TCIMRota03 { -webkit-animation: TCIMRota03 .5s ease-in-out; animation: TCIMRota03 .5s ease-in-out}

@-webkit-keyframes TCIMRota05 {0%,30%{-webkit-transform: rotate(-22deg)} 100%{-webkit-transform: rotate(3deg)}}
@keyframes TCIMRota05 {0%,30%{transform: rotate(-22deg)} 100%{transform: rotate(3eg)}}
.TCIMRota05 { -webkit-animation: TCIMRota05 .5s ease-in-out; animation: TCIMRota05 .5s ease-in-out}

@-webkit-keyframes TCIMRota06 {0%,30%{-webkit-transform: rotate(24deg)} 100%{-webkit-transform: rotate(-1deg)}}
@keyframes TCIMRota06 {0%,30%{transform: rotate(24deg)} 100%{transform: rotate(-1eg)}}
.TCIMRota06 { -webkit-animation: TCIMRota06 .5s ease-in-out; animation: TCIMRota06 .5s ease-in-out}


@-webkit-keyframes caseBG {0%,40%{-webkit-transform:scale(0)} 100%{-webkit-transform: scale(1)}}
@keyframes caseBG {0%,40%{transform:scale(0)} 100%{transform: scale(1)}}
.caseBG {
  -webkit-animation: caseBG .75s cubic-bezier(.075,.82,.165,1); animation: caseBG .75s cubic-bezier(.075,.82,.165,1);
  -webkit-transform-origin:left bottom; transform-origin:left bottom}
    
/* How to use */
#THowToUse { padding-bottom: 40px}

#travelersHTUseST { padding: 10px 10px 7px 10px}
#travelersHTUseST .onChar8, #travelersHTUseST .onChar11 { width: 7px}

#threeStepInfo { font-size: clamp(2rem, 3.5vw, 2.2rem) !important; padding: 5px 0 0 10px !important}

#threeStepIList { margin: 20px auto 0}

.TStepNum { color: #555; font-size: 3.4rem;font-style: normal}

.TSIDetail { display: flex; flex-direction: column; padding: 40px 0; border: 1px solid #bbb;}

.TSIST { color: #f0f0f0; background: #555; font-size: 1.8rem; text-align: center; letter-spacing: .04em; margin: -7px 0 0; padding: 15px 0 17px}

.TSIGuide { font-size: 1.7rem; font-weight: 600; text-align: center; line-height: 1.5; letter-spacing: .04em; margin: 24px 0 0}
.TSIIM, .DLocLine, .DLIM { background: url(../travelers/images/travelers05.svg) no-repeat 0 0 / 300px 546px}
.TSIIM { height: 200px; margin: 0 auto}

.TSIIM, .DLocLine, .DLIM { background: url(../travelers/images/travelers05.svg) no-repeat 0 0 / 300px 546px}
.TSIIM { height: 200px; margin: 0 auto}

@media (min-width: 525px) { .TSIGuide br{ display: none} }

@media (max-width: 809px) {
  .TStepItem { width: 90%; max-width: 450px; margin: 22px auto 0; position: relative} .TStepItem:nth-of-type(1) { margin-top: 0}
  .TStepItem::after{
    content: ''; position: absolute; bottom: -35px; left: 50%;
    background: #f27700; width: 24px; height: 20px; clip-path: polygon(50% 100%, 0 0, 100% 0); margin-left: -10px; display: block}
  .TStepItem:nth-of-type(3)::after { display: none}  .TSLArrow { display: none} .TSIDetail { padding: 35px 0} }

@media (min-width: 810px) {
  #threeStepIList { align-items: center} .TStepItem { width: 31%} .TSIGuide br{ display: block}
  .TSIGuide { display: flex; align-items: center; justify-content: center; min-height: 90px; padding: 0 10px}
  .TSLArrow { background: #f27700; width: 3vw; height: 2.8vw; clip-path: polygon(0 0, 0% 100%, 75% 50%); margin: 0 -9px 0 0; display: block} }

@media (max-width: 630px) { #THowToUse .pagePadP02 { margin-top: 10px}}

.TSIIM01 { width: 95px}
.TSIIM02 { background-position: -100px 0; width: 200px}
.TSIIM03 { background-position: 0 -210px; width: 220px}

.depositLocation, .depositLocation02 { align-items: center; max-width: 580px; margin: 60px auto 0}
.depositLocation02 { margin-top: 45px}

.DLocItem01, .DLocItem02 { justify-content: center; width: 120px}

.DLocLine { background-position: 0 -520px; width: 300px; height: 26px; display: block}

.DLIName01, .DLIName02 { order: 2; font-size: 3rem; text-align: center; letter-spacing: .06em; margin: 12px 0 0}

.DLIImage { order: 1; width: 110px}

.DLIM { width: 110px; height: 88px; margin: 0 auto; display: block}
.DLIAPort { background-position: 0 -420px; width: 110px}
.DLIHotel01 { background-position: -130px -420px; width: 70px}
.DLIHotel02 { background-position: -220px -420px; width: 80px}

#DLocCopy02 { font-size: 2rem; padding-top: 18px !important}

@media (min-width: 640px) {.DLocNotice { display: block;}}
@media (max-width: 680px) {
  .depositLocation, .depositLocation02 { width: 90%; min-width: 320px; max-width: 360px} .DLIName01, .DLIName02 { font-size: 2.6rem}
  .DLocItem01, .DLIImage { width: 90px} .DLocItem02 { width: 90px}
  .DLIM, .DLocLine { background: url(../travelers/images/sp_travelers.svg) no-repeat 0 0 / 252px 100px; height: 76px}
  .DLIHotel01 { background-position: -110px 0; width: 63px} .DLIHotel02 { background-position: -180px 0; width: 72px}
  .DLIAPort { width: 100px} .DLocLine { background-position: 0 -80px; width: 120px; height: 20px; display: block}
  .DLL01 { margin-right: -12px} #DLocCopy { font-size: 1.8rem} }

@media (max-width: 639px) { #DLocCopy02 { text-align: left;}}
@media (max-width: 459px) { #DLocCopy .spNBlock { display: block}}

/* -------------------------------------------
 Become a PARTNER
------------------------------------------- */
#accPTE .onChar11, #accPTE .onChar13 { width: 12px}

#BPartnerHeadCopy sup { font-size: clamp(1.7rem, 3.25vw, 2rem); font-weight: 500; vertical-align: 9px; margin-left: 1px}

@media (max-width: 699px) { .accHCBlock { display: block} }

@media (max-width: 559px) { #accPTE { font-size: 9vw} }

@media (max-width: 459px) { #accomodationHeadCopy { font-size: 2.25rem} }
@media (max-width: 349px) { #accomodationHeadCopy { font-size: 1.7rem}}

.AccHNKind { text-align: center; margin: 0 auto;}

/* Merit */
#BMeritST { padding: 7px 8px 5px 14px}

#buratabiMerit { align-items: stretch; margin: 50px auto 0}

.BMeritItem { width: 47.5%; border: 1px solid #bbb}

.BMeritItem:nth-of-type(3), .BMeritItem:nth-of-type(4) { margin-top: calc(5% - 2px)}

.BMIIM { width: 100%; display: block}
.BMIIM img { width: 100%; height: auto}

.BMIDetail { font-weight: 700; margin: 0; padding: 30px}

.BMIST { color: #2e5599; font-size: 2.3rem; letter-spacing: .06em}

.BMIInfo { font-size: 1.8rem; line-height: 1.5; letter-spacing: .06em; margin: 20px 0 0}
.BMIInfo br { display: none}

.BMIllustItem { display: flex; align-items: center; width: 66%; margin-top: 3%}
.spDelivery { width: 100%; height: auto; margin: 0 auto}

.BMAndMore { color: #f96200; font-size: 6.8rem; text-align: center; letter-spacing: .01em; margin: 40px 0 0}

.BMAndMore .onChar8 { width: 17px}

@media (max-width: 880px) { }
@media (max-width: 820px) { .BMIDetail { padding: 25px 20px} }

@media (max-width: 767px) {
  #buratabiMerit { margin-top: 40px} .BMIllustItem { width: 75%; margin: 4% auto 0}
  .BMeritItem:nth-of-type(3), .BMeritItem:nth-of-type(4) { margin-top: 5%} .BMAndMore { font-size: 5rem} }

@media (max-width: 499px) {
  .BMeritItem { width: 100%; margin: 25px auto 0} .BMIDetail { padding: 25px}
  .BMeritItem:first-of-type { margin-top: 0} .BMIllustItem { width: 90%; margin-top: 25px}
  .BMAndMore { font-size: 4.4rem} }

/* More Merit */
#whyBuratabi { padding-bottom: 30px}

#moreMerit { margin: 15px auto 0}

.MMItem {
  display: flex; flex-direction: column;
  background: #f0f0f0; width: calc(47.5% - 60px); 
  margin-top: 4.5%; padding: 30px; border: 1px solid #bbb; position: relative}

.MMImage { width: 30%}

.MMST { flex-grow:1; color: #2e5599; font-size: 2.2rem; text-align: center; line-height: 1.33; letter-spacing: .05em; margin: 0}
.MMSTW { line-height: 1.4; width: 8.6em; margin: 0 auto}
#MMST02 { margin-top: 15px}

.MMInfo { flex-grow:1; font-size: 1.6rem; letter-spacing: .05em; line-height: 1.8; margin: 25px 0 0; padding: 0 !important}
.MMInfo br { display: none}
#MMInfo03 { margin-top: -15px}

.MMIM { flex-grow:1; width: 210px; height: 150px; margin: 25px auto 0}
#MMI00 { height: 110px; margin-top: 35px} #MMI02 { margin: 33px auto} #MMI03 { margin-top: 10px}

.MMISM01::before, .MMISM02::before {
  content: "*"; color: #e35; font-size: 1.8rem; margin-right: 1.5px; display: inline-block;
  -webkit-transform: translateY(4px); transform: translateY(4px)}

.MMISM01 { color: #7e553e; line-height: 1.6 !important; display: block}
.MMISM02 { color: #7e553e; line-height: 1.6 !important; margin-top: 8px; display: block}

@media (min-width: 641px) and (max-width: 879px) { #MMI02 { margin: 48px auto}}
@media (max-width: 767px) {
  #moreMerit { margin-top: 18px} .MMItem { padding: 30px} .MMImage { width: 25%}
  .MMST { font-size: 2.1rem} .MMInfo { font-size: 1.5rem; padding: 0 !important} }

@media (max-width: 699px) { #moreMerit { margin-top: 25px} .MMItem { width: calc(48% - 40px); margin-top: 3.45%; padding: 30px 20px} }

@media (max-width: 640px) {
  .MMItem { width: 100%; padding: 30px 50px} #MMI00 { margin-top: 30px}
  #MMI02 { margin: 20px auto 0} #MMI03, #MMInfo03 { margin-top: 25px} .MMSTW { width: auto} }

@media (max-width: 599px) {
  .MMItem { display: block} .MMImage { position: absolute; top: 15px; right: 15px; width: 134px}
  .MMDetail { width: 100%}}

@media (max-width: 499px) {
  .MMItem { display: flex; margin-top: 20px; padding: 35px 30px 30px} .MMDetail { order: 1} .MMInfo { padding: 0 !important}
  .MMImage { order: 2; position: relative; top: inherit; right: inherit; width: 60%; margin: 10px auto 0} }

@media (max-width: 419px) { .MMItem { padding: 35px 6vw 30px} .MMImage { width: 64%} .MMSTW { width: 8.6em} }
@media (max-width: 399px) { .MMISM01 { line-height: 1.4; margin: 0; display: block} }

/* -------------------------------------------
 COMPANY
------------------------------------------- */
#aboutPTEN .onChar10 { width: .25em}

.compST { width: 175px}

#compST { font-size: 2.8rem}

.profST { line-height: 1.2; width: 5.2em; padding: 10px 6px 9px 10px}
.profST .onChar12 { margin-left: .33em}

.CPST { text-align: center; padding: 1px 15px 0 10px}

.CPST::after { bottom: 22px}

.CPSTJP { letter-spacing: .05em; text-indent: .05em}

.compStEn { color: #999; font-size: 1.4rem; letter-spacing: .025em; margin-top: 7px; transform: scaleY(.88); display: block}

.compListBox { width: calc(100% - 230px)}

.compList { margin: 0; padding: 0}

.compList { color: #595959; font-size: 1.6rem; line-height: 1.6; letter-spacing: .075em}

.compLDT { width: 140px; margin: -.5px 0 0; padding: 22px 0 21px; border-top: 2px solid #3e77cc; position: relative}
.compLDT:last-of-type { border-bottom: 2px solid #3e77cc}

.compLDD { word-break: break-all; width: calc(100% - 148px); margin: 0; padding: 21px 0 20px 8px; border-top: 1px solid #bbb}
.compLDD:last-of-type { border-bottom: 1px solid #bbb}

@media (max-width: 799px) { .compListBox { width: calc(100% - 220px)} .compList { font-size: 1.5rem} }

@media (max-width: 739px) {
  .compST { width: 100%} .profST { width: auto; padding-right: 12px} .compListBox { width: 100%; margin-top: 40px}
  .compLDT { width: 120px; padding-left: 10px} .compLDD { width: calc(100% - 140px); padding-left: 10px} }

@media (max-width: 699px) {
  .compLDT, .compLDD { width: 100%; display: block}
  .compLDT { color: #333; font-weight: 700; padding: 15px 10px 0; border-top: 1px solid #bbb; position: relative; z-index: 1}
  .compLDD { font-weight: 400; line-height: 1.5; padding: 4px 10px 15px; border: none} .compLDT:last-of-type { border-top: 1px solid #bbb; border-bottom: none}
  .compLDT::after {
    content: ''; position: absolute; top: -1.5px; left: 0;
    background: #3e77cc; width: 175px; height: 2px; display: block; z-index: 2} }

@media (max-width: 389px) { .compLDT, .compLDD { padding-left: 0; padding-right: 0} }
@media (max-width: 369px) { .compLDT, .compLDD { letter-spacing: .035em;} }

/* -------------------------------------------
  FAQ
------------------------------------------- */
.faqSoon { font-size: clamp(3.5rem,6vw, 4.2rem) !important; margin: 16vw 0 !important}

.QAPTJP { font-size: 2.8rem}

.QAList {
  text-decoration: none; margin: 0; padding:0 0 7px; border-bottom: 1px solid #bbb}

.question {
  background: url(../faq/images/question.svg) no-repeat 0 33px / 28px 32px; min-height: 30px;
  font-size: 1.6rem; line-height: 1.6; font-weight: 500; letter-spacing: .07em;
  margin: 30px 0 24px; padding: 35px 0 0 40px; border-top: 1px solid #bbb}

.question:first-of-type { margin-top: 0}

.question a {
  color: #444; text-decoration: none; display: block; position: relative;
  z-index: 1; cursor: pointer; overflow: hidden}

.answer {
  background: url(../faq/images/answer.svg) no-repeat 0 2px / 30px 28px;
  color: #555; font-size: 1.5rem; font-weight: 400; line-height: 2.2; letter-spacing: .06em; margin: 0 0 0 40px; padding: 0 0 0 40px}
.answer .second { margin-top: 12px; display: block}

.QANotice { color: #c30}

.QASign {
  background: #f57200; vertical-align: 4px; display: inline-block; position: relative;
  width: 25px; height: 1px; margin: -15px 0 0 20px; transition: inherit; pointer-events: none}

.QASign:before {
  content: ''; position: absolute; right: 0; bottom: 0; transition: inherit;
  border-top: 2px solid transparent; border-right: 5px solid transparent;
  border-left: 3px solid #f57200; border-bottom: 4px solid #f57200}

.active .QASign { background:#009245; -webkit-transform: rotate(90deg); transform: rotate(90deg) }
.active .QASign:before { border-top: 2px solid transparent; border-right: 5px solid transparent;
  border-left: 3px solid #009245; border-bottom: 4px solid #009245}

@media (max-width: 767px) { .answer { margin-left: 0} }

/* -------------------------------------------
 NEWS
------------------------------------------- */
/* News List */
#newsWrapp { padding: 0 4vw 22px}

.NLLink {
  text-decoration: none; padding: 50px 15px; border-bottom: 1px solid #bbb;
  display: block; position: relative; z-index: 1; cursor: pointer; overflow: hidden}

.NLLink::after {
  content: ''; position: absolute; top: 0; left: 0; right: auto; background: #e2f7f9; width: 0; height: 100%; z-index: -1}
.NLLink:hover::after { width: 100%}

.NLTit { color: #333; font-size: 1.7rem; line-height: 1.8; letter-spacing: .06em; margin: 0}

.NLTime { color: #7e7e7e; letter-spacing: .075em; width: 10em}

.NLCopy { width: calc(100% - 10em - 30px); padding-right: 30px}

.NLSign {
  position: absolute; top: 50%; right: 20px;
  background: #bbb; width: 20px; height: 20px; margin-top: -10px; display: block}

.NLSign::before, .NLSign::after { content: ''; position: absolute; top: 50%; background: #fff; height: 2px}
.NLSign::before { left: 6px; width: 8px}
.NLSign::after { right: 7px; width: 4px; margin-top: -2px; -webkit-transform: rotate(45deg); transform: rotate(45deg)}

@media (max-width: 767px) { .NLTime { width: 9em} .NLCopy { width: calc(100% - 9em - 30px)} }

@media (max-width: 699px) {
  .NLTit { display: flex; -webkit-justify-content: flex-start; justify-content: flex-start; -webkit-flex-flow: column; flex-flow: column}
  .NLCopy { order: 1; font-size: 1.5rem; width: calc(100% - 20px); padding-right: 0;} .NLTime { order: 2; font-size: 1.4rem; width: 100%}
  .NLLink { padding: 40px 10px} .NLSign { right: 10px} }

@media (max-width: 540px) {
  .NLLink { padding: 35px 5px} .NLCopy { width: calc(100% - 18px)}
  .NLSign { right: 5px; width: 18px; height: 18px} .NLSign::before { left: 5px} .NLSign::after { right: 6px} }

 @media (max-width: 540px) { .NLLink { padding: 35px 0}  .NLSign { right: 0}  }

/* News Post */
#newsIndWrapp {padding-top: 40px;}

.newsAHead { padding-bottom: 40px; border-bottom: 1px solid #bbb}

.newsTitle { font-size: 2.4rem; line-height: 1.4; letter-spacing: .05em; margin: 0; padding-bottom: 15px}

.newsTime { color: #777; font-size: 1.5rem; letter-spacing: .08em; display: block}

.newsBody { padding-top: 15px}

.newsBody p, .newsBody li { font-size: 1.6rem; line-height: 2.2; letter-spacing: .06em; margin: 1.25em 0 0}
.newsBody h2, .newsBody h3, .newsBody h4, .newsBody h5 { color: #494949; line-height: 1.4; letter-spacing: .06em; margin: 1.35em 0 .5em}
.newsBody h2 { font-size: 2.5rem; margin: 1.33em 0 0; padding-bottom: 5px; border-bottom: 2px solid #ccc; display: inline-block}
.newsBody h3 { font-size: 2.3rem}
.newsBody h4 { font-size: 2.0rem}
.newsBody h5 { font-size: 1.8rem}
.newsBody ul { margin: 0; padding: 0 0 0 36px}
.newsBody li { margin: 0; list-style-type: circle}

.newsBody img { width: 100% !important; max-width: 1000px; height: auto !important; margin: 0 auto; padding: 10px 0; display: block}
.newsBody a img { text-decoration: none; border: none; outline: none}


@media (max-width: 600px) {
  .newsTitle { font-size: 2.3rem} .newsBody h2 { font-size: 2.3rem} .newsBody h3 { font-size: 2.1rem}
  .newsBody h4 { font-size: 1.9rem} .newsBody h5 { font-size: 1.7rem}}

/* CMS List Navigation */
#paginationList { text-align: center; margin: 0 auto; padding: 30px 7px 0 0}

#paginationList li { font-size: 1.6rem; margin: 7px 0 0 7px; display: inline-block}
.win .notoSans { font-weight: bold}

.link_page, .current_page { width: 40px; height: 40px; margin-top: 5px; display: block; position: relative; z-index: 1}

.link_page:before, .link_page:after, .current_page:before {
  content: ''; position: absolute; top: -11px; left: 0; width: 40px; height: 40px;
  -webkit-border-radius: 50%; border-radius: 50%}

#paginationList .link_page:before { background: #4799d5; z-index: -2}
#paginationList .current_page:before { background: #c5c5b2; z-index: -1}

#paginationList a { color: #fff; text-decoration: none; cursor: pointer; display: block}

.current_page { color: #f9f9f9; }

#paginationList .link_before, #paginationList .link_next {
  color: #4799d5; font-size: 2.6rem; padding: 0 5px;
  -webkit-transform: translateY(4px); transform: translateY(4px); display: inline-block}

/* Individual Pagination */
#newsIndNavi, #blogIndNavi { margin: 0 auto; padding: 0 5px 5px; position: relative}

.win .indPageNavi { font-weight: 500}

.indPageNavi a {
 color: #555; font-size: 1.5rem; text-align: center; letter-spacing: .1em; text-decoration: none;
 padding: 35px 0 34px; display: block; position: relative; z-index: 1}

#newsIndNavi.indPageNavi a:hover, #blogIndNavi.indPageNavi a:hover { color: #fff; text-shadow: none}

.previousEntry, .nextEntry { letter-spacing: .06em; width: calc(33.5% - 5px)}
.previousEntry { border-right: 2px solid #fff}
.nextEntry { border-left: 2px solid #fff}
.returnList { letter-spacing: .2em; width: 33%}
.returnList .spFalse { margin-right: 10px}

.previousEntry a:before, .returnList a:before, .nextEntry a:before,
.previousEntry a:after, .returnList a:after, .nextEntry a:after {
 content: ''; position: absolute; top: 0; left: 0; width: 100%; height: 100%; display: block; z-index: -1}

#newsIndNavi .previousEntry a:before, #newsIndNavi .nextEntry a:before { background: #e0e0e0}
#newsIndNavi .returnList a:before { background: #d2d2d2}

#blogIndNavi .previousEntry a:before, #blogIndNavi .nextEntry a:before { background: #f2f0de}
#blogIndNavi .returnList a:before { background: #e2e2d5}

.previousEntry a:after, .returnList a:after, .nextEntry a:after {
 background: #66b5c0; -webkit-transform: scaleX(0); transform: scaleX(0)}
.returnList a:after { background: #888}

#blogIndNavi .previousEntry a:after, #blogIndNavi .nextEntry a:after { background: #b9b29e}
#blogIndNavi .returnList a:after { background: #999582}

.previousEntry a:after { -webkit-transform-origin: top right; transform-origin: top right}
.returnList a:after { -webkit-transform-origin: 50%; transform-origin: 50%}
.nextEntry a:after { -webkit-transform-origin: top left; transform-origin: top left}

.previousEntry a:hover:after, .returnList a:hover:after, .nextEntry a:hover:after {
 -webkit-transform: scaleX(1); transform: scaleX(1)}

/* Pagination Link Sign */
.RLSign, .PESign, .NESign { position: absolute; top: 50%; background: #444; height: 1px; transition: inherit; pointer-events: none}

.RLSign { top: inherit; bottom: 15px; left: calc(50% - 20px); background: #555; width: 32px}
.PESign { top: calc(50% + 1px); left: 20%; background: #555; width: 24px}
.NESign { top: calc(50% + 1px); right: 20%; background: #555; width: 24px}

.PLSign:before, .NESign:before {
  content: ''; position: absolute; right: 0; bottom: 0; transition: inherit;
  border-top: 2px solid transparent; border-right: 5px solid transparent;
  border-left: 3px solid #555; border-bottom: 4px solid #555}

.PESign:before, .returnList a i:before {
  content: ''; position: absolute; left: 0; bottom: 0; transition: inherit; border-top: 1px solid transparent;
  border-left: 6px solid transparent; border-right: 3px solid #555; border-bottom: 4px solid #555}
.NESign:before { border-left: 3px solid #555; border-bottom: 4px solid #555}

.returnList a .RLSign:before {
  content: ''; position: absolute; bottom: 8px; left: 13px; transition: inherit; border-top: 1px solid transparent;
  border-left: 6px solid transparent; border-right: 3px solid #555; border-bottom: 4px solid #555}
.returnList a .RLSign:after {
  content: ''; position: absolute; bottom: 0;right: 0; width: 15px; height: 8px;
  border-top: 1px solid #555; border-right: 1px solid #555; transition: inherit; }

a:hover .PESign { left: 16%; background: #fff}
a:hover .PESign:before { border-right: 3px solid #fff; border-bottom: 4px solid #fff}
a:hover .NESign { right: 16%; background: #fff}
a:hover .NESign:before { border-left: 3px solid #fff; border-bottom: 4px solid #fff}
  
.returnList a:hover i { left: 50%; background: #fff; width: 20px}
.returnList a:hover i:before {
    left: -15px; border-right: 3px solid #fff; border-bottom: 4px solid #fff}
.returnList a:hover i:after { width: 28px; border-color: #fff}

@media (max-width: 560px) {
  .PESign { left: 15%} .NESign { right: 15%} .NESign:before { border-left: 3px solid #555; border-bottom: 3px solid #555}
  .PESign:before, .returnList a i:before {
    border-left: 5px solid transparent !important; border-bottom: 3px solid #555 !important} }

@media (max-width: 480px) {
  #newsPostWrapp { padding-bottom: 40px} .indPageNavi a { font-size: 1.4rem; padding: 17px 0 27px}
  .returnList .spFalse { display: none} .PESign, .NESign { top: inherit; bottom: 16px}
  .PESign { left: 50%; margin-left: -12px} .NESign { right: 50%; margin-right: -12px} .RLSign { bottom: 12px} }

/* -------------------------------------------
  Contact Page
------------------------------------------- */
#contactPTEn .onChar6 { margin: 0 -1px} #contactPTEn .onChar12 { width: 9px}

#contact { padding-top: 60px}

#contactHead { max-width: 1200px; margin: 0 auto; padding: 50px 5vw}
#contactHead { padding-top: 0}

.ownsAccount { border-bottom: 1px solid #bbb}
.ownsAccInner { -webkit-justify-content:flex-start; justify-content:flex-start; margin: 0 auto}

.ownsAccCopy { font-size: 1.6rem; letter-spacing: .075em; margin: 0; padding: 7px 30px 0 0}

#contactForm { background: #fff; margin: 0 auto; position: relative}

.contactST { font-weight: 700; color: #555; font-size: 3rem; letter-spacing: .025em; margin: 0}

.contactForm { margin-top: 10px}

@media (min-width: 600px) { .ownsAccInner, #contactForm { max-width: 720px; padding: 0 2vw} }

@media (max-width: 420px) { .ownsAccCopy { padding-right: 20px} }
@media (max-width: 399px) {
  .ownsAccount { padding: 40px 0 35px} .ownsAccCopy { text-align: center; width: 100%; padding: 0}
  .COALogin { margin: 25px auto 0} #webForm{ padding-top: 40px} }
 
/* Progress Area */
.formProgress { width: 56%; min-height: 65px; margin: 25px auto 0; padding: 0; position: relative}

.formProgress:before {
  content: ''; position: absolute; top: 46px; left: 50%;
  background: #ccc; width: 176%; height: 1px; margin-left: -88%}

@media (max-width: 600px) { .formProgress { width: 76%} .formProgress:before { width: 130%; margin-left: -65%}}
@media (max-width: 440px) { .formProgress { width: 80%} .formProgress:before { width: 124%; margin-left: -62%} }
@media (max-width: 410px) { .formProgress { width: 90%} .formProgress:before { width: 108%; margin-left: -54%} }
@media (max-width: 370px) { .formProgress { width: 92%} .formProgress:before { width: 106%; margin-left: -53%} }

@media (min-width: 600px) { .formProgress { margin-top: 15px} }
@media (min-width: 700px) { .formProgress { margin-top: 0} }

#FPInput, #FPConfirm, #FPCompletion {
  color: #7e7e7e; font-size: 1.5rem; font-weight: 500; text-align: center;
  letter-spacing: .02em; text-indent: .1em; width: 98px; position: relative}

#FPInput::before, #FPConfirm::before {
  content: ''; position: absolute; top: 35px; left: 50%; width: 0; height: 0; border-style: solid;
  border-width: 12px 0 12px 20px; border-color: transparent transparent transparent #aeaeae}
#FPCompletion::before {
  content: ''; position: absolute; top: 36px; left: 50%; width: 20px; height: 20px;
  background: #aeaeae; -webkit-border-radius: 50%; border-radius: 50%}

#FPInput.FPOnPhase::before, #FPConfirm.FPOnPhase::before {
  top: 32px; left: 50%; border-width: 30px 18px 0 18px;
  border-color: #2e7eae transparent transparent transparent}
#FPInput.FPOnPhase::after, #FPConfirm.FPOnPhase::after {
  content: ''; position: absolute; top: 38px; left: 50%; width: 0; height: 0; border-style: solid;
  border-width: 14px 8px 0 8px; border-color: #fff transparent transparent transparent}

#FPCompletion.FPOnPhase::before { top: 32px; left: 50%; background: #33b3d0; width: 30px; height: 30px}

#FPInput::before, #FPInput.FPOnPhase::after, #FPConfirm.FPOnPhase::after { margin-left: -9px}
#FPInput.FPOnPhase::before, #FPConfirm.FPOnPhase::before { margin-left: -19px}
#FPConfirm::before { margin-left: -8px} 
#FPCompletion { width: 98px}
#FPCompletion::before { margin-left: -10px}
#FPCompletion.FPOnPhase::before { margin-left: -15px}

#formNotice { font-size: 1.4rem; letter-spacing: .06em; margin: 30px 0 0; padding-left: 18px; position: relative}

#formNotice::before, .required::before, #MFConsent::before {
  content: ''; position: absolute; top: 3px; width: 12px; height: 6px;
  border-left: 2px solid #f0521e; border-bottom: 2px solid #f0521e; -webkit-transform: rotate(-50deg); transform: rotate(-50deg)}
#formNotice::before { left: 0} .required::before { left: 0}
#MFConsent::before { top: 38px; left: 50%; margin-left: -19.75em}

@media (max-width: 480px) { #formNotice .spFalse, #formNotice::before { display: none !important} }
@media (max-width: 420px) {
  #MFConsent { padding-top: 25px !important}
  #MFConsent .spNBlock { margin-top: 5px; display: block} #MFConsent::before { top: 28px; margin-left: -11.65em} }

@media (max-width: 369px) { .SPF02 { display: none} }

/* Form Area */
#formContents { margin-top: 35px}
#mfp_hidden { display: none}

.MFItem { margin: 30px 0 0; position: relative}

.required, .optional { font-size: 1.5rem; letter-spacing: .06em; text-indent: 18px}

.optional:before {
  content: ''; position: absolute; top: 2px; left: 0; background: #ccc; width: 12px; height: 12px}

.MFIKind { font-style: normal; display: block}

.MFNotice { color: #006eb2; font-size: 1.3rem; letter-spacing: .05em; margin: 8px 0 0 10px; display: block;}

.MFSelect, .inp01, .mail, textarea {
  color: #006eb2; font-size: 1.5rem; letter-spacing: .02em; padding: 8px; margin-top: 10px;
  border: none; outline: none; vertical-align: .2em; border: 2px solid #ccc; -webkit-appearance: none; appearance: none}
.MFSelect { width: 14em; -webkit-border-radius: 5px; border-radius: 5px}
.inp01, .mail { width: 85%}

textarea { font-size: 1.8rem !important; line-height: 1.8; width: calc(100% - 34px); height: 15em !important; padding: 10px 15px}

.inp01, #contactContents { -webkit-appearance: none;appearance: none }
::-webkit-input-placeholder { color:#888} :-ms-input-placeholder { color:#888} ::placeholder{ color:#888}
::placeholder {font-size: 1.5rem} input::-webkit-input-placeholder {font-size: 1.5rem} input:-moz-placeholder {font-size: 1.5rem}
input::-moz-placeholder {font-size: 1.5rem} input:-ms-input-placeholder {font-size: 1.5rem}

#MFConsent {
  text-align: center; letter-spacing: .025em; margin: 0 auto; padding-top: 35px; position: relative}

#consent { margin: 0 6px 0 5px; vertical-align: 3px}

#consentLabel {
  color: #82694e; font-weight: bold; letter-spacing: 0; text-indent: 0;
  display: block; position: relative; z-index: 1; cursor: pointer}

#MFBTArea { padding-top: 52px; position: relative}

.TFSend, #MFContainer p.TFReset { text-align: center; margin: 0; padding: 0; border: none}

.mfp_element_button {
  font-size: 1.6rem; line-height: 2; letter-spacing: .1em;
  width: calc(50% - 15px); text-transform: uppercase; padding: 5px 0 6px 1px;
  position: relative; border: none; outline: none; cursor: pointer; -webkit-appearance: none; appearance: none}

#sendBT {
  color: #fff; background: #2e7eae; font-size: 1.6rem; font-weight: bold; letter-spacing: .04em;
  width: 100%; margin: 0 auto; padding: 12px 0 12px 1px; border: none;
  border-radius: 4px; position: relative; display: block}
#sendMessage { display: none}

#mfp_button_send, #mfp_button_cancel { color: #fff; font-weight: bold; border-radius: 4px}
#mfp_button_send { background: #2e7eae}
#mfp_button_cancel { background-color: #777}

#sendBT, #mfp_button_send, #mfp_button_cancel { -webkit-appearance: none; appearance: none}

@media (max-width: 400px) { .MFSelect { width: 90%}}
@media (max-width: 365px) { #spConsent .spNFalse { display: none} }

@media (min-width: 480px) { #sendBT { max-width: 360px}}
@media (min-width: 640px) { .mfp_element_button { width: calc(48% - 15px)}}

/* Form Privacy */
.formPrivacy { height: 180px; margin: 30px 0 0; padding: 20px 0; border: 1px solid #ccc; position: relative; overflow: hidden}

.FPInner {  height: 100%; padding: 0 15px; position: relative;-webkit-overflow-scrolling: touch; overflow-y: auto}
.FPTitle {
  color: #82694e; font-size: 1.6rem; font-weight: bold; text-align: center; letter-spacing: .1em; margin: 0 0 10px}

#FPList dt, #FPList dd, .formPrivacy p { font-size: 1.4rem; letter-spacing: .025em; line-height: 1.8; padding: 0}
#FPList dt { font-size: 1.5rem; font-weight: bold; margin: 15px 0 0} #FPList dd { font-size: 1.3rem; margin: 0; padding: 3px 0 0}
#FPList ul { margin: 0; padding: 0 0 0 2.5em} #FPList li { list-style-type: circle}
.formPrivacy p { color: #82694e; font-weight: bold; margin: 0}

/* Checkbox */
.repItem, .mfp_element_hidden { display: none}

.repItem[type='checkbox'] { position: absolute; visibility: hidden !important}

.repItem[type='checkbox'] + label:before, .repItem[type='checkbox'] + label:after,
.repItem[type='checkbox'] + .mfp_element_hidden[type='hidden'] + label:before,
.repItem[type='checkbox'] + .mfp_element_hidden[type='hidden'] + label:after {
  content: ''; position: absolute; left: 50%;
  -webkit-box-sizing: border-box; box-sizing: border-box; -webkit-transform: rotate(0); transform: rotate(0)}

.repItem[type='checkbox'] + label:before,
.repItem[type='checkbox'] + .mfp_element_hidden[type='hidden'] + label:before {
  top: 29px; background: #fff; width: 40px; height: 20px; margin-left: -20px;
  border: 1px solid #92a2b2; -webkit-border-radius: 15px; border-radius: 15px; }

.repItem[type='checkbox'] + label:after,
.repItem[type='checkbox'] + .mfp_element_hidden[type='hidden'] + label:after {
  top: 30px; background: #92a2b2; width: 18px; height: 18px; margin-left: -19px;
  -webkit-transition: all .2s ease-out; transition: all .2s ease-out;
  -webkit-border-radius: 50%; border-radius: 50%; z-index: 10}

.repItem[type='checkbox']:checked + label:after,
.repItem[type='checkbox']:checked + .mfp_element_hidden[type='hidden'] + label:after { background: #00bb0e; margin-left: 1px; }

@media (max-width: 420px) {
  .repItem[type='checkbox'] + label:before, .repItem[type='checkbox'] + .mfp_element_hidden[type='hidden'] + label:before { top: 45px}
  .repItem[type='checkbox'] + label:after, .repItem[type='checkbox'] + .mfp_element_hidden[type='hidden'] + label:after  { top: 46px}
  #MFBTArea { padding-top: 45px} }

/* Error Message */
.mfp_err {
  color: #d20; background: url(../contact/images/mfp_error.gif) no-repeat 0 15px; font-size: 1.4rem; text-align: left;
  line-height: 1.2; letter-spacing: .025em; margin: 0; padding-top: 15px; clear: both; display: none}

#MFConsent .mfp_err { margin-top: 32px; padding-left: 20px}

.mfp_parent_error { border: solid 2px #f00}

.problem { background-color: #fCC}

#mfp_error {  background-color: #fee; padding: 10px; border: solid 1px #f00; display: none}
#mfp_error p { font-size: 1.4rem; text-align: center; padding: 0; margin: 0}
#mfp_error p strong { color: #d20; font-size: 1.8rem}

/* SSL Info */
#siteSsl { text-align: center; margin: 35px auto 0; padding-top: 18px; border-top: 1px solid #ddd; display: block}

.sslInfo { font-size: 1.3rem; text-align: left; line-height: 1.8; letter-spacing: .025em; margin: 0; display: inline-block}

/* Confirm */
#mfp_phase_confirm h4 { color: #f26500; font-size: clamp(2.3rem,5vw,2.8rem); text-align: center; letter-spacing: .035em; margin: 25px 0 0}

#mfp_phase_confirm h4 .onChar11, #mfp_phase_confirm h4 .onChar19, #mfp_phase_confirm h4 .onChar24 { width: .33em}

#mfp_confirm_table { width: 100%; margin: 30px 0 0; border: none; border-spacing: 1px; border-bottom: 1px solid #ddd}

#mfp_confirm_table th, #mfp_confirm_table td {
  font-size: 1.6rem; line-height: 1.5; letter-spacing: .04em; display: block}
#mfp_confirm_table th { color: #4e4e4e; text-align: left; padding: 12px 20px 0; vertical-align: top}
#mfp_confirm_table td { color: #00597e; padding: 6px 20px 12px}

#mfp_confirm_table tr:nth-of-type(odd) th, #mfp_confirm_table tr:nth-of-type(odd) td { background: #f5f5f5}

.mfp_buttons { margin: 30px auto} #mfp_button_send, #mfp_button_cancel { width: 47.25%}

@media (min-width: 560px) { #mfp_confirm_table td { padding-left: 30px}}

/* completion */
#completionWrapp { padding-top: 20px}

#completionBCList { padding-bottom: 18px}

#completionST { color: #2e5e8e; font-size: clamp(2.45rem,5.5vw,3.3rem); text-align: center; letter-spacing: .033em; margin: 40px 0 0}

#completionST .onChar5 { margin-right: -.1em}
#completionST .onChar9, #completionST .onChar17, #completionST .onChar21, #completionST .onChar26 { width: .225em}

.completionInfo {
  font-size: 1.6rem; font-weight: 600; line-height: 1.75; letter-spacing: .033em;
  max-width: 24.85em; margin: 40px auto 0; padding: 0 40px}
  
.completionInfo > .PPad12 { display: block}

@media (min-width: 600px) { #completionWrapp { padding-top: 30px}}
@media (min-width: 700px) { #completion { padding-bottom: 1vw} #completionWrapp { padding-top: 45px}}
@media (max-width: 599px) { #completionWrapp { padding-top: 20px} #completionST {margin-top: 30px} .completionInfo { margin-top: 35px} }
@media (max-width: 480px) { .completionInfo { font-size: 1.5rem}}


/* -------------------------------------------
  Lagel
------------------------------------------- */
#legalTit, #privacyTit, #cancelPTJP { font-size: clamp(3.6rem, 5.6vw, 4rem); margin: 0}

@media (max-width: 480px) { #privacyTit, #cancelPTJP { font-size: 3.2rem} }

.legalPTitle { margin: 0}

#legalPTEN, #privacyPTEN, #CancelPTEN { font-size: clamp(3rem, 4.4vw, 3.6rem)}

#legalPTEN .onChar10, #legalPTEN .onChar13, #privacyPTEN .onChar12, #CancelPTEN .onChar17 { width: 9px}

.legalWrapp, .policyWrapp { max-width: 760px; margin: 0 auto}

.legalItem { margin: 0; padding: 36px 0 32px; border-bottom: 1px solid #bbb}
.legalItem:first-of-type { padding-top: 0}
.legalItem:last-of-type { padding-bottom: 35px; border-bottom: 4px solid #d5d5d5}

.legalItem dt, .policyIntro dt { font-size: 1.8rem; letter-spacing: .06em; margin: 0}

.legalItem dd, .legalInfo, .policyIntro dd, .policyItem dd, .cancelList li, .cancelInfo {
  font-size: 1.5rem; line-height: 1.75; letter-spacing: .035em; margin: 1.33em 0 0}

.legalItem ol { padding-left: 1.5em}
.legalItem li { margin-top: 18px}

.OLNoPad li { margin-top: 5px !important}

.legalInfo { padding: 0 0 1.75em; border-bottom: 4px solid #d5d5d5}

.legalCreation { padding-bottom: 20px}

.legalMail { font-size: 1.5rem }
@media (max-width: 460px) { .legalMail { white-space: nowrap; padding-left: 1em} }

.policyST { font-size: 2.4rem; letter-spacing: .05em; margin: 0}

@media (max-width: 369px) { .policyST { font-size: 2.3rem} }

.policyIntro { margin: 0; padding: 45px 0 0}

.policyItem { margin: 0; padding: 0}

.policyItem dt { font-size: 2rem; letter-spacing: .06em; margin: 45px 0 0}
.policyItem dd { margin-top: 1.2em}

@media (max-width: 639px) { .PIspBlock07 { margin: 10px 0 0 1.42em; display: block} }

.policyItem ul { margin: 0; padding: 10px 0 0 10px}
.policyItem li { margin-top: 6px; padding-left: 8px}
.policyItem li::before { content: "●";color: #bbb; font-size: 7px; vertical-align: 3px; margin: 0 6px 0 -12px}

.cancelList { margin: 40px 0 0; padding: 0}

.cancelList li { padding-left: 1.5em}

.cancelNum { margin: 0 3px 0 -1.2em}

.cancelInfo { margin-top: 26px; padding-top: 1.5em; border-top: 2px solid #ccc}

.canceInnerList, .canceInnerList li { margin: 0; padding: 0}

@media (max-width: 369px) { #cancelPTJP #termsPTEN { font-size: 3.5rem !important} #cancelPTJP .onChar17 { width: 8px !important} }


/* -------------------------------------------
 CSS Animation
------------------------------------------- */
/* Common Animation */
.GNLink, .GNLink::after, .HMBox, .HNMenuSign, .ANLink, .ANlangSign, .FANlangSign, .FANLink, .appStore, .googlePlay, .FNLink,
.ONItem em, .MBSubCatch, .MBMainCatch, .TNNLink, .TNILink, #retTop a, #retTop a:after, .BCLink a, .tLink01, .tLink01:after,
.NLTit , .NLSign, .indPageNavi a, .QASign, .question a, .BBEN, .BBJP, .FLangLink, .ANInstaLink, .FNInstaLink, #botLogo {
  -webkit-transition: all .15s ease-in-out .05s; transition: all .15s ease-in-out .05s}

#globalHead, .homeLink, #GNav, #trigger-overlay::before, #trigger-overlay::after, .FNLink::after,
.ANLoginBT::before, .ANLoginBT::after, .FANLogin::before, .FANLogin::after, .ANEntryBT::before, .ANEntryBT::after,
.FANEntry::before, .FANEntry::after, .FANlangBT::before, .FANlangBT::after, #retTop::before, #retTop::after,
.TNNLink::after, .TNILink::after, .THNLink::after, .NLLink::after, .previousEntry a:before, .returnList a:before,
.nextEntry a:before, .previousEntry a:after, .returnList a:after, .nextEntry a:after, #mfp_button_send, #mfp_button_cancel {
 -webkit-transition: all .35s cubic-bezier(.075, .82, .165, 1) .05s; transition: all .35s cubic-bezier(.075, .82, .165, 1) .05s}

 .link_page:before, .link_page:after, .link_before, .link_next { -webkit-transition: all .2s ease-in-out .1s; transition: all .2s ease-in-out .1s}

.ALThumb img, .NLLink img, .NLNoImage, .NLNoImage::after { -webkit-transition: all .25s ease-in-out .05s; transition: all .25s ease-in-out .05s}

.fixedBT { -webkit-transition: all .35s ease-in-out .1s; transition: all .35s ease-in-out .1s}

/* Standerd */
@-webkit-keyframes fadeIn { 0%{ opacity: 0} 100%{ opacity: 1} }
@keyframes fadeIn { 0%{ opacity: 0} 100%{ opacity: 1} }
.fadeIn { -webkit-animation: fadeIn .75s ease-in-out; animation: fadeIn .75s ease-in-out; -webkit-animation-fill-mode:both; animation-fill-mode:both}
.fadeIn02 { -webkit-animation: fadeIn 1s ease-in-out; animation: fadeIn 1s ease-in-out; -webkit-animation-fill-mode:both; animation-fill-mode:both}
.fadeIn03 { -webkit-animation: fadeIn 1.2s ease-in-out; animation: fadeIn 1.2s ease-in-out; -webkit-animation-fill-mode:both; animation-fill-mode:both}

@-webkit-keyframes fadeOut { 0%{ opacity: 1} 100%{ opacity: 0} }
@keyframes fadeOut { 0%{ opacity: 1} 100%{ opacity: 0} }
.fadeOut { -webkit-animation: fadeOut .6s ease-in-out; animation: fadeOut .6s ease-in-out;
-webkit-animation-fill-mode:both; animation-fill-mode:both}

@-webkit-keyframes fadeDown {
  0%,25%{ -webkit-transform: translate3d(0,-30px,0); opacity: 0} 100%{ -webkit-transform:none; opacity: 1} }
@keyframes fadeDown { 0%,25%{ transform: translate3d(0,-30px,0); opacity: 0} 100%{ transform:none; opacity: 1} }
#globalHeader, .fadeDown01 {
  -webkit-animation: fadeDown .8s ease-in-out; animation: fadeDown .8s ease-in-out}
.fadeDown02, #homeLogo { -webkit-animation: fadeDown 1s ease-in-out; animation: fadeDown 1s ease-in-out}

@-webkit-keyframes fadeUp {
  0%,25%{ -webkit-transform: translate3d(0,20px,0); opacity: 0} 100%{ -webkit-transform:none; opacity: 1} }
@keyframes fadeUp { 0%,25%{ transform: translate3d(0,20px,0); opacity: 0} 100%{ transform:none; opacity: 1} }
.fadeUp01, #firstVBT { -webkit-animation: fadeUp .65s ease-in-out; animation: fadeUp .65s ease-in-out}
.fadeUp02, #recruitBT { -webkit-animation: fadeUp .8s ease-in-out; animation: fadeUp .8s ease-in-out}
.fadeUp03 { -webkit-animation: fadeUp .95s ease-in-out; animation: fadeUp .95s ease-in-out}
.fadeUp04 { -webkit-animation: fadeUp 1.1s ease-in-out; animation: fadeUp 1.1s ease-in-out}
.fadeUp05 { -webkit-animation: fadeUp 1.25s ease-in-out; animation: fadeUp 1.25s ease-in-out}

@-webkit-keyframes leftIn {
  0%,25%{ -webkit-transform: translate3d(-30px,10px,0); opacity: 0} 100%{ -webkit-transform:none; opacity: 1} }
@keyframes leftIn { 0%,25%{ transform: translate3d(-30px,10px,0); opacity: 0} 100%{ transform:none; opacity: 1} }
.leftIn00 { -webkit-animation: leftIn .4s ease-in-out; animation: leftIn .4s ease-in-out}
.leftIn01 { -webkit-animation: leftIn .6s ease-in-out; animation: leftIn .6s ease-in-out}
.leftIn02 { -webkit-animation: leftIn .8s ease-in-out; animation: leftIn .8s ease-in-out}
.leftIn03 { -webkit-animation: leftIn 1s ease-in-out; animation: leftIn 1s ease-in-out}
.leftIn04 { -webkit-animation: leftIn 1.15s ease-in-out; animation: leftIn 1.15s ease-in-out}

@-webkit-keyframes rightIn {
  0%,25%{ -webkit-transform: translate3d(30px,10px,0); opacity: 0} 100%{ -webkit-transform:none; opacity: 1} }
@keyframes rightIn { 0%,25%{ transform: translate3d(30px,0,0); opacity: 0} 100%{ transform:none; opacity: 1} }
.rightIn00 { -webkit-animation: rightIn .4s ease-in-out; animation: rightIn .4s ease-in-out}
.rightIn01,#TCharaContainer { -webkit-animation: rightIn .6s ease-in-out; animation: rightIn .6s ease-in-out}
.rightIn02, #trigger-overlay { -webkit-animation: rightIn .8s ease-in-out; animation: rightIn .8s ease-in-out}
.rightIn03 { -webkit-animation: rightIn 1s ease-in-out; animation: rightIn 1s ease-in-out}
.rightIn04 { -webkit-animation: rightIn 1.15s ease-in-out; animation: rightIn 1.15s ease-in-out}

@-webkit-keyframes scaleUp {0%,30%{-webkit-transform:scale(0);opacity:0} 100%{-webkit-transform: scale(1);opacity:1}}
@keyframes scaleUp {0%,30%{transform:scale(0);opacity:0} 100%{transform: scale(1);opacity:1}}
.scaleUp01 {
  -webkit-animation: scaleUp .5s cubic-bezier(.075,.82,.165,1); animation: scaleUp .5s cubic-bezier(.075,.82,.165,1);
  -webkit-transform-origin:center; transform-origin:center}
.scaleUp02 {
  -webkit-animation: scaleUp .66s ease-in-out; animation: scaleUp .66s ease-in-out;
  -webkit-transform-origin:center; transform-origin:center}
.scaleUp03 {
  -webkit-animation: scaleUp 1s cubic-bezier(.075,.82,.165,1); animation: scaleUp 1s cubic-bezier(.075,.82,.165,1);
  -webkit-transform-origin:center; transform-origin:center}
.squareBG {
  -webkit-animation: scaleUp .65s cubic-bezier(.075,.82,.165,1); animation: scaleUp .65s cubic-bezier(.075,.82,.165,1);
  -webkit-transform-origin:right center; transform-origin:right center}

/* Lettering Animation */
@-webkit-keyframes typing01 {0%,50%{-webkit-transform:translate3d(-10px,-10px,0);opacity:0} 100%{-webkit-transform:none;opacity:1}}
@keyframes typing01 {0%,50%{transform:translate3d(-10px,10px,0);opacity:0} 100%{transform:none;opacity:1}}
.onChar1{display:inline-block;-webkit-animation:typing01 .2s ease;animation:typing01 .2s ease}.onChar2{display:inline-block;-webkit-animation:typing01 .3s ease;animation:typing01 .3s ease}.onChar3{display:inline-block;-webkit-animation:typing01 .4s ease;animation:typing01 .4s ease}.onChar4{display:inline-block;-webkit-animation:typing01 .5s ease;animation:typing01 .5s ease}.onChar5{display:inline-block;-webkit-animation:typing01 .6s ease;animation:typing01 .6s ease}.onChar6{display:inline-block;-webkit-animation:typing01 .7s ease;animation:typing01 .7s ease}.onChar7{display:inline-block;-webkit-animation:typing01 .8s ease;animation:typing01 .8s ease}.onChar8{display:inline-block;-webkit-animation:typing01 .9s ease;animation:typing01 .9s ease}.onChar9{display:inline-block;-webkit-animation:typing01 1s ease;animation:typing01 1s ease}.onChar10{display:inline-block;-webkit-animation:typing01 1.1s ease;animation:typing01 1.1s ease}.onChar11{display:inline-block;-webkit-animation:typing01 1.2s ease;animation:typing01 1.2s ease}.onChar12{display:inline-block;-webkit-animation:typing01 1.3s ease;animation:typing01 1.3s ease}.onChar13{display:inline-block;-webkit-animation:typing01 1.4s ease;animation:typing01 1.4s ease}.onChar14{display:inline-block;-webkit-animation:typing01 1.5s ease;animation:typing01 1.5s ease}.onChar15{display:inline-block;-webkit-animation:typing01 1.55s ease;animation:typing01 1.55s ease}.onChar16{display:inline-block;-webkit-animation:typing01 1.6s ease;animation:typing01 1.6s ease}.onChar17{display:inline-block;-webkit-animation:typing01 1.65s ease;animation:typing01 1.65s ease}.onChar18{display:inline-block;-webkit-animation:typing01 1.7s ease;animation:typing01 1.7s ease}.onChar19{display:inline-block;-webkit-animation:typing01 1.75s ease;animation:typing01 1.75s ease}.onChar20{display:inline-block;-webkit-animation:typing01 1.8s ease;animation:typing01 1.8s ease}.onChar21{display:inline-block;-webkit-animation:typing01 1.85s ease;animation:typing01 1.85s ease}.onChar22{display:inline-block;-webkit-animation:typing01 1.9s ease;animation:typing01 1.9s ease}.onChar23{display:inline-block;-webkit-animation:typing01 1.95s ease;animation:typing01 1.95s ease}.onChar24{display:inline-block;-webkit-animation:typing01 2s ease;animation:typing01 2s ease}.onChar25{display:inline-block;-webkit-animation:typing01 2.05s ease;animation:typing01 2.05s ease}.onChar26{display:inline-block;-webkit-animation:typing01 2.1s ease;animation:typing01 2.1s ease}.onChar27{display:inline-block;-webkit-animation:typing01 2.15s ease;animation:typing01 2.15s ease}.onChar28{display:inline-block;-webkit-animation:typing01 2.2s ease;animation:typing01 2.2s ease}.onChar29{display:inline-block;-webkit-animation:typing01 2.25s ease;animation:typing01 2.25s ease}.onChar30{display:inline-block;-webkit-animation:typing01 2.3s ease;animation:typing01 2.3s ease}.onChar31{display:inline-block;-webkit-animation:typing01 2.35s ease;animation:typing01 2.35s ease}.onChar32{display:inline-block;-webkit-animation:typing01 2.4s ease;animation:typing01 2.4s ease}.onChar33{display:inline-block;-webkit-animation:typing01 2.45s ease;animation:typing01 2.45s ease}.onChar34{display:inline-block;-webkit-animation:typing01 2.5s ease;animation:typing01 2.5s ease}.onChar35{display:inline-block;-webkit-animation:typing01 2.55s ease;animation:typing01 2.55s ease}.onChar36{display:inline-block;-webkit-animation:typing01 2.6s ease;animation:typing01 2.6s ease}.onChar37{display:inline-block;-webkit-animation:typing01 2.65s ease;animation:typing01 2.65s ease}.onChar38{display:inline-block;-webkit-animation:typing01 2.7s ease;animation:typing01 2.7s ease}.onChar39{display:inline-block;-webkit-animation:typing01 2.75s ease;animation:typing01 2.75s ease}.onChar40{display:inline-block;-webkit-animation:typing01 2.8s ease;animation:typing01 2.8s ease}

.thc02 .onChar1{display:inline-block;-webkit-animation:typing01 1s ease;animation:typing01 1s ease}.thc02 .onChar2{display:inline-block;-webkit-animation:typing01 1.1s ease;animation:typing01 1.1s ease}.thc02 .onChar3{display:inline-block;-webkit-animation:typing01 1.2s ease;animation:typing01 1.2s ease}.thc02 .onChar4{display:inline-block;-webkit-animation:typing01 1.3s ease;animation:typing01 1.3s ease}.thc02 .onChar5{display:inline-block;-webkit-animation:typing01 1.4s ease;animation:typing01 1.4s ease}.thc02 .onChar6{display:inline-block;-webkit-animation:typing01 1.5s ease;animation:typing01 1.5s ease}.thc02 .onChar7{display:inline-block;-webkit-animation:typing01 1.6s ease;animation:typing01 1.6s ease}.thc02 .onChar8{display:inline-block;-webkit-animation:typing01 1.7s ease;animation:typing01 1.7s ease}.thc02 .onChar9{display:inline-block;-webkit-animation:typing01 1.8s ease;animation:typing01 1.8s ease}.thc02 .onChar10{display:inline-block;-webkit-animation:typing01 1.85s ease;animation:typing01 1.85s ease}.thc02 .onChar11{display:inline-block;-webkit-animation:typing01 1.9s ease;animation:typing01 1.9s ease}.thc02 .onChar12{display:inline-block;-webkit-animation:typing01 1.95s ease;animation:typing01 1.95s ease}.thc02 .onChar13{display:inline-block;-webkit-animation:typing01 2s ease;animation:typing01 2s ease}.thc02 .onChar14{display:inline-block;-webkit-animation:typing01 2.05s ease;animation:typing01 2.05s ease}.thc02 .onChar15{display:inline-block;-webkit-animation:typing01 2.1s ease;animation:typing01 2.1s ease}.thc02 .onChar16{display:inline-block;-webkit-animation:typing01 2.15s ease;animation:typing01 2.15s ease}.thc02 .onChar17{display:inline-block;-webkit-animation:typing01 2.15s ease;animation:typing01 2.15s ease}.thc02 .onChar18{display:inline-block;-webkit-animation:typing01 2.2s ease;animation:typing01 2.2s ease}.thc02 .onChar19{display:inline-block;-webkit-animation:typing01 2.25s ease;animation:typing01 2.25s ease}.thc02 .onChar20{display:inline-block;-webkit-animation:typing01 2.3s ease;animation:typing01 2.3s ease}.thc02 .onChar21{display:inline-block;-webkit-animation:typing01 2.35s ease-in-out;animation:typing01 2.35s ease}.thc02 .onChar22{display:inline-block;-webkit-animation:typing01 2.4s ease;animation:typing01 2.4s ease}.thc02 .onChar23{display:inline-block;-webkit-animation:typing01 2.45s ease;animation:typing01 2.45s ease}.thc02 .onChar24{display:inline-block;-webkit-animation:typing01 2.5s ease;animation:typing01 2.5s ease}

@-webkit-keyframes movTyping {0%,70%{-webkit-transform:translate3d(-8px,8px,0);opacity:0} 100%{-webkit-transform:none;opacity:1}}
@keyframes movTyping {0%,70%{transform:translate3d(-8px,8px,0);opacity:0} 100%{transform:none;opacity:1}}
.movType .onChar1{display:inline-block;-webkit-animation:movTyping .8s ease;animation:movTyping .8s ease}.movType .onChar2{display:inline-block;-webkit-animation:movTyping .9s ease;animation:movTyping .9s ease}.movType .onChar3{display:inline-block;-webkit-animation:movTyping 1s ease;animation:movTyping 1s ease}.movType .onChar4{display:inline-block;-webkit-animation:movTyping 1.1s ease;animation:movTyping 1.1s ease}.movType .onChar5{display:inline-block;-webkit-animation:movTyping 1.2s ease;animation:movTyping 1.2s ease}.movType .onChar6{display:inline-block;-webkit-animation:movTyping 1.2s ease;animation:movTyping 1.2s ease}.movType .onChar7{display:inline-block;-webkit-animation:movTyping 1.3s ease;animation:movTyping 1.3s ease}.movType .onChar8{display:inline-block;-webkit-animation:movTyping 1.9s ease;animation:movTyping 1.9s ease}.movType .onChar9{display:inline-block;-webkit-animation:movTyping 2.1s ease;animation:movTyping 2.1s ease}.movType .onChar10{display:inline-block;-webkit-animation:movTyping 2.5s ease;animation:movTyping 2.5s ease}.movType .onChar11{display:inline-block;-webkit-animation:movTyping 2.9s ease;animation:movTyping 2.9s ease}.movType .onChar12{display:inline-block;-webkit-animation:movTyping 3.3s ease;animation:movTyping 3.3s ease}.movType .onChar13{display:inline-block;-webkit-animation:movTyping 2.8s ease;animation:movTyping 2.8s ease}.movType .onChar14{display:inline-block;-webkit-animation:movTyping 3.7s ease;animation:movTyping 3.7s ease}

.movType02 .onChar1{display:inline-block;-webkit-animation:movTyping 2.3s ease;animation:movTyping 2.3s ease}.movType02 .onChar2{display:inline-block;-webkit-animation:movTyping 2.4s ease;animation:movTyping 2.4s ease}.movType02 .onChar3{display:inline-block;-webkit-animation:movTyping 2.5s ease;animation:movTyping 2.5s ease}.movType02 .onChar4{display:inline-block;-webkit-animation:movTyping 2.6s ease;animation:movTyping 2.6s ease}.movType02 .onChar5{display:inline-block;-webkit-animation:movTyping 2.7s ease;animation:movTyping 2.7s ease}.movType02 .onChar6{display:inline-block;-webkit-animation:movTyping 2.8s ease;animation:movTyping 2.8s ease}.movType02 .onChar7{display:inline-block;-webkit-animation:movTyping 2.9s ease;animation:movTyping 2.9s ease}.movType02 .onChar8{display:inline-block;-webkit-animation:movTyping 2.9s ease;animation:movTyping 2.9s ease}.movType02 .onChar9{display:inline-block;-webkit-animation:movTyping 3s ease;animation:movTyping 3s ease}.movType02 .onChar10{display:inline-block;-webkit-animation:movTyping 3.1s ease;animation:movTyping 3.1s ease}.movType02 .onChar11{display:inline-block;-webkit-animation:movTyping 3.2s ease;animation:movTyping 3.2s ease}.movType02 .onChar12{display:inline-block;-webkit-animation:movTyping 3.3s ease;animation:movTyping 3.3s ease}.movType02 .onChar13{display:inline-block;-webkit-animation:movTyping 3.4s ease;animation:movTyping 3.4s ease}.movType02 .onChar14{display:inline-block;-webkit-animation:movTyping 3.5s ease;animation:movTyping 3.5s ease}.movType02 .onChar15{display:inline-block;-webkit-animation:movTyping 3.6s ease;animation:movTyping 3.6s ease}.movType02 .onChar16{display:inline-block;-webkit-animation:movTyping 3.7s ease;animation:movTyping 3.7s ease}.movType02 .onChar17{display:inline-block;-webkit-animation:movTyping 3.8s ease;animation:movTyping 3.8s ease}

#THEnCopy .thc01 .onChar3, #THEnCopy .thc01 .onChar11, #THEnCopy .thc01 .onChar22, #THEnCopy .thc02 .onChar5,
#THEnCopy .thc02 .onChar14, #THEnCopy .thc02 .onChar19, #THEnCopy .thc02 .onChar28 { margin-left: 8px}




/* -------------------------------------------
  Text Link Hover
------------------------------------------- */
.tLink01, .newsBody p a { color: #1e8eb7; text-decoration: none; display: inline-block; position: relative}
.tLink01:hover, .newsBody p a:hover { color: #f07700}
.FNLink:hover { color: #5ec9e5}

.BreadcrumbList a::after, .tLink01::after, .FNLink::after, .newsBody p a::after {
  content: ''; position: absolute; bottom: -3px; left: 0; background-color: #f07700; width: 100%; height: 2px;
  -webkit-transform: scaleX(0); transform: scaleX(0); -webkit-transform-origin: left bottom; transform-origin: left bottom}
.BreadcrumbList a::after { bottom: 0}
.FNLink::after { bottom: 0; background: #3e7e8e;}
.newsBody p a::after { bottom: 2px}
.newsBody p .NBPopIM::after { display: none}

.BreadcrumbList a:hover::after, .tLink01:hover::after, .FNLink:hover::after, .newsBody p a:hover::after {
  -webkit-ttransform: scaleX(1); transform: scaleX(1)}

/* -------------------------------------------
  Displey Setting
------------------------------------------- */
.homeLink, #retTop, #botLogo, #ORLogo, .IMST, .IMCopy, .PIBanner {
  text-indent: 400%; white-space: nowrap; overflow: hidden}

.homeLink, #retTop a, .IBNLink {
  text-decoration: none; display: block; cursor: pointer; overflow: hidden}

#globalNav .current { cursor: default}
