@charset "utf-8";
/* CSS Document */

/* =====================================================
  共通
===================================================== */
#wrap-contents #wrap-container:first-child #contents:first-child:before, #wrap-contents .amc-breadcrumbs-wrapper+#AMC-for-you:before, #wrap-contents .amc-breadcrumbs-wrapper+#wrap-container #contents:first-child:before, #wrap-contents.wideMainVisual #wrap-container.contents-1col:first-child:before {
  display: none;
}
#wrapper ~ img {display: none}
#wrap-container {
  max-width: none;
  padding: 0;
}

.contents-1col #contents .res-contents.res-contents-nallow {
  margin-left: 0;
  margin-right: 0;
  padding-left: 0;
  padding-right: 0;
}

.txt_bold {
  font-weight: bold;
}
.mt15 {margin-top: 15px;}
.mt30 {margin-top: 30px;}

.linkTypeBtn a {
  display: block;
  padding: 13px 45px 12px 30px;
  text-decoration: none;
  position: relative;
  background: #00146e;
  border-radius: 4px;
  transition: .2s;
  color: #ffffff;
  text-align: center;
}
.linkTypeBtn a:after {
  content: '';
  display: inline-block;
  width: 10px;
  height: 10px;
  border-top: 1px solid #fff;
  border-right: 1px solid #fff;
  transform: rotate(45deg);
  position: absolute;
  top: 50%;
  right: 26px;
  margin-top: -7px;
}
.tab-content.is_show .sectionBox.bgType_001 .linkTypeBtn a:hover,
.linkTypeBtn a:hover {
  background: #f0f3f8;
}
.programeCol .linkTypeBtn a:hover,
.contBtnBlock .linkTypeBtn a:hover,
.linkTypeBtn.type001 a:hover,
.sectionBox.bgType_001 .linkTypeBtn a:hover,
.relationCol .linkTypeBtn a:hover,
.linkTypeBtn a.inflight-wwslink:hover {
  background: #0f2356;
}
.deco-brackets:before {
  content: '\05b';
}
.deco-brackets:after {
  content: '\05d';
}
.LoungelinkList li a:hover,
.flowAncBlock .flowAncList .item a:hover {
  background: #f0f3f8;
}

.bdrBtm {
  border-bottom: 1px solid #d1d3d7;
}

.ico-pdf-img {
  display: none !important;
/*
  display: inline-block;
  margin-left: .5em;
  vertical-align: middle;
*/
}

.mealSearch {
  margin-top: 45px;
}
.mealSearch .res-fr-0010.res-contents-parent {
  margin-top: 0;
}

.spTagRep a.repObj {
  display: block;
  text-decoration: none;
  color: #333;
}

.hideTag {
  position: absolute;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  border: 0;
  z-index: -10;
  width: 0;
  height: 0;
}

ul.colWrap_list_type03 {
  list-style-type: disc;
  margin-left: 20px;
}
ul.colWrap_list_type03 li {
  padding-top: 5px;
}

.font_break-all {
  word-break: break-all;
}

/* ボタン下線 ------------------------------ */
.mainContWrap .tab_inner_list a ,
.mainContWrap .cautionLst a ,
.mainContWrap .sub_txt a ,
.mainContWrap .txt a ,
.mainContWrap .listTxt a ,
.mainContWrap .pickUpLst a,
.mainContWrap .tab_inner_note a,
.mainContWrap .caution_list a,
.mainContWrap .colWrap p a {
  text-decoration: underline;
}

@media screen and (max-width: 1240px) {
  .max-inner {
    padding: 0 4%;
  }
}

@media screen and (max-width: 767px) {
  #wrap-contents {
    padding-bottom: 35px;
  }
  .mealSearch {
    margin-top: 22px;
  }
  .linkTypeBtn a {
    max-width: 100%;
  }
}

/*
target=_blankをしている画像に別窓アイコンを重ねる用
*/
.blankimg-top,
.blankimg {
  display:block;
  position:relative;
}
.blankimg-top span,
.blankimg span {
  background-color:#fff;
  border-radius:2px;
  display:block;
  padding:2px 5px;
  position:absolute;
  right:4px;
}
.blankimg-top span.icon-top {
  top:4px;
}
.blankimg span.icon-bottom {
  bottom:4px;
}
.blankimg-top span img.ico-blank-img,
.blankimg span img.ico-blank-img {
  display: inline-block;
  vertical-align: middle;
  margin-top: 0;
  margin-right: 4px;
  margin-left: 4px;
  width: auto !important;
  padding:0;
  border: none !important;
}


/* =====================================================
  ヘッダー
===================================================== */
#eachClassHeader {
  transform: translate3d(0, 0, 0);
  z-index: 10;
  position: relative;
}
#eachClassHeader .classNavi {
  background: #1f1f1f;
  position: relative;
}
#eachClassHeader .classNavi > .naviList {
  display: flex;
  max-width: 1240px;
  margin: 0 auto;
  padding-right: 20px;
  padding-left: 20px;
}
#eachClassHeader .classNavi > .naviList > li {
  width: calc(90%/4);
  padding-top: 1px;
}
#eachClassHeader .classNavi > .naviList > li.top {
  width: 10%;
}
#eachClassHeader .classNavi > .naviList > li > a {
  display: table;
  table-layout: fixed;
  width: 100%;
  height: 100%;
  padding: 9px 0 5px;
  color: #fff;
  text-align: center;
  font-size: 1.6rem;
  text-decoration: none;
  cursor: default;
}
#eachClassHeader .classNavi > .naviList > li.top a {
  cursor: pointer;
}
#eachClassHeader .classNavi > .naviList > li a .txtWrap {
  display: table-cell;
  padding: 0 5px;
  border-right: 1px solid rgba(255,255,255,0.6);
  vertical-align: middle;
}
#eachClassHeader .classNavi > .naviList > li:first-child a .txtWrap {
  border-left: 1px solid rgba(255,255,255,0.6);
}
#eachClassHeader .classNavi > .naviList > li a .txtWrap .txt {
  display: inline-block;
}

/* active */
#eachClassHeader .classNavi > .naviList > li.active {
/*  padding-top: 1px;*/
}
#eachClassHeader .classNavi > .naviList > li.active > a {
  background: #fff;
  border: 1px solid #999;
  transform: translateX(-1px);
}
#eachClassHeader .classNavi > .naviList .top.active > a {
  border-bottom: 4px solid #1f1f1f;
}
#eachClassHeader .classNavi > .naviList .class-f.active > a {
  border-bottom: 4px solid #B01F24;
}
#eachClassHeader .classNavi > .naviList .class-c.active > a {
  border-bottom: 4px solid #0b2c93;
}
#eachClassHeader .classNavi > .naviList .class-py.active > a {
  border-bottom: 4px solid #007440;
}
#eachClassHeader .classNavi > .naviList .class-y.active > a {
  border-bottom: 4px solid #4AB033;
}

#eachClassHeader .classNavi > .naviList > li.active > a {
  color: #1f1f1f;
}

#eachClassHeader .classNavi > .naviList > li > a .txtWrap .txt {
  padding-right: 25px;
  position: relative;
}
#eachClassHeader .classNavi > .naviList > li.top > a .txtWrap .txt {
  padding-right: 0;
  position: static;
}
#eachClassHeader .classNavi > .naviList > li > a .txtWrap .txt:after {
  content: '';
  border-right: 4px solid transparent;
  border-top: 6px solid #fff;
  border-left: 4px solid transparent;
  position: absolute;
  top: 50%;
  right: 0;
  margin-top: -5px;
}
#eachClassHeader .classNavi > .naviList > li.active > a .txtWrap .txt:after {
  border-top-color: #1f1f1f;
}

#eachClassHeader .classNavi > .naviList > li.top > a .txtWrap .txt:after {
  content: none;
}


#eachClassHeader .classNavi .serviceNavi {
  display: none;
  width: 100%;
  padding: 20px 0 28px;
  background: #fff;
  position: absolute;
  top: 45px;
  left: 0;
  z-index: 999;
}
#eachClassHeader .classNavi > .naviList > li.mAct .serviceNavi {
  display: flex;
}
#eachClassHeader .serviceNavi > .naviList {
  display: flex;
  width: 100%;
  max-width: 1240px;
  margin: 0 auto;
  padding-right: 20px;
  padding-left: 20px;
}
#eachClassHeader .serviceNavi > .naviList > li {
  width: calc(100%/7);
}
#eachClassHeader .serviceNavi > .naviList > li a {
  display: block;
  text-decoration: none;
  text-align: center;
}
#eachClassHeader .serviceNavi > .naviList > li .iconBlock {
  display: table;
  width: 100%;
  height: 48px;
  table-layout: fixed;
}
#eachClassHeader .serviceNavi > .naviList > li .iconBlock .iconInner {
  display: table-cell;
  vertical-align: middle;
}
#eachClassHeader .serviceNavi > .naviList > li .iconBlock .iconInner svg {
  display: inline-block;
  line-height: 0;
  vertical-align: middle;
}

#eachClassHeader .serviceNavi > .naviList > li .txtBlock {
  margin-top: 5px;
}
#eachClassHeader .serviceNavi > .naviList > li .txtBlock .txt {
  font-size: 1.2rem;
  color: #1f1f1f;
}
/* active */
#eachClassHeader.actClass-f .serviceNavi > .naviList > li.active .iconBlock svg path  {
  fill: #B01F24;
}
#eachClassHeader.actClass-c .serviceNavi > .naviList > li.active .iconBlock svg path  {
  fill: #0b2c93;
}
#eachClassHeader.actClass-py .serviceNavi > .naviList > li.active .iconBlock svg path  {
  fill: #007440;
}
#eachClassHeader.actClass-y .serviceNavi > .naviList > li.active .iconBlock svg path  {
  fill: #4AB033;
}

/* active(hover時) */
#eachClassHeader.actClass-f .serviceNavi > .naviList > li a:hover .iconBlock svg path  {
  fill: #B01F24;
}
#eachClassHeader.actClass-c .serviceNavi > .naviList > li a:hover .iconBlock svg path  {
  fill: #0b2c93;
}
#eachClassHeader.actClass-py .serviceNavi > .naviList > li a:hover .iconBlock svg path  {
  fill: #007440;
}
#eachClassHeader.actClass-y .serviceNavi > .naviList > li a:hover .iconBlock svg path  {
  fill: #4AB033;
}

/* 追従 */
#eachClassHeader.fixed {
  position: fixed;
  top: 64px;
  left: 0;
  z-index: 999999;
  width: 100%;
  -webkit-transition: top .4s ease-out;
  -o-transition: top .4s ease-out;
  transition: top .4s ease-out;
  animation: topMove 0.5s cubic-bezier(0.65, 0.15, 0.2, 1.01) 1;
}
@keyframes topMove {
  0% {top: 0;}
  100% {top: 64px;}
}

#eachClassHeader.fixed .classNavi > .naviList > li a {
  padding: 6px 0 3px;
  font-size: 1.4rem;
}

#eachClassHeader.fixed .serviceNavi {
  display: none;
  background: #fff;
  top: 37px;
}
#eachClassHeader .serviceNavi > .naviList > li .iconBlock svg {
  transform: scale(0.8);
}
#eachClassHeader.fixed .serviceNavi > .naviList > li .txtBlock .txt {
  font-size: 1.2rem;
}

@media screen and (max-width: 1024px) {
  #eachClassHeader.fixed {
    top: 0;
    animation: topMove_sp 0.5s cubic-bezier(0.65, 0.15, 0.2, 1.01) 1;
  }
  @keyframes topMove_sp {
    0% {top: -50px;}
    100% {top: 0;}
  }
  #eachClassHeader .classNavi .serviceNavi {
    top: 39px;
  }
  #eachClassHeader.fixed .serviceNavi {
    top: 34px;
  }

}

@media screen and (min-width: 768px) and (max-width: 1024px) {

  #eachClassHeader .classNavi > .naviList > li a {
    font-size: 1.2rem;
  }
  #eachClassHeader.fixed .classNavi > .naviList > li a {
    font-size: 1.2rem;
  }
  #eachClassHeader .classNavi > .naviList > li > a .txtWrap .txt {
    padding-right: 18px;
  }
  #eachClassHeader.menuOpen .classNavi > .naviList > li.active > a .txtWrap .txt:after {
    transform: rotate(-135deg);
    top: 2px;
  }

}


@media screen and (max-width: 767px) {
  #eachClassHeader .classNavi > .naviList > li,
  #eachClassHeader .classNavi > .naviList > li.top {
    width: 100%;
  }
   #eachClassHeader .classNavi > .naviList > li a {
     padding: 5px 0 6px;
     background: #1f1f1f !important;
     border: none !important;
     color: #fff !important;
  }
  #eachClassHeader .classNavi > .naviList > li .txtWrap {
    border: none !important;
  }
  #eachClassHeader .classNavi > .naviList > li .txtWrap .txt {
    padding-right: 0 !important;
  }
  #eachClassHeader .classNavi > .naviList > li.active > a .txtWrap .txt:after {
    content: none;
  }

}



/* =====================================================
  フッター
===================================================== */
#eachClassFooter {
  background: #1f1f1f;
}
#eachClassFooter .max-inner {
  padding: 0 20px;
}

#eachClassFooter .thisClassService {
  padding: 25px 0 11px;
  border-bottom: 1px solid #7f7f7f;
}
#eachClassFooter .thisClassService .classHead .headTxt {
  font-size: 1.6rem;
  font-weight: bold;
  color: #fff;
}
#eachClassFooter .thisClassService .serviceMenu {
  margin-top: 10px;
}
#eachClassFooter .thisClassService .serviceMenu .menuList {
  font-size: 0;
}
#eachClassFooter .thisClassService .serviceMenu .menuList li {
  display: inline-block;
  min-width: 300px;
  margin-bottom: 13px;
  padding: 0 15px;
  position: relative;
}
#eachClassFooter .thisClassService .serviceMenu .menuList li:before {
  content: '';
  width: 7px;
  height: 7px;
  display: inline-block;
  border-top: 1px solid #fff;
  border-right: 1px solid #fff;
  transform: rotate(45deg);
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  margin: auto;
  box-sizing: border-box;
}
#eachClassFooter .thisClassService .serviceMenu .menuList li a {
  font-size: 1.4rem;
  color: #fff;
  text-decoration: none;
}
#eachClassFooter .thisClassService .serviceMenu .menuList li a:hover {
  text-decoration: underline;
}

#eachClassFooter .otherClass {
  padding: 25px 0 30px;
}
#eachClassFooter .otherClass .otherClassHead .headTxt {
  font-size: 1.6rem;
  font-weight: bold;
  color: #fff;
}
#eachClassFooter .otherClass .listWrap {
  margin-top: 16px;
}
#eachClassFooter .otherClass .listWrap .classList li {
  float: left;
  width: 22.5%;
  margin-left: 3.333333333333333%;
  background: #fff;
}
#eachClassFooter .otherClass .listWrap .classList li:first-child {
  margin-left: 0;
}

#eachClassFooter .otherClass .listWrap .classList li a {
  display: block;
  width: 100%;
  table-layout: fixed;
  text-decoration: none;
  font-size: 0;
}
#eachClassFooter .otherClass .listWrap .classList li.thisClass a {
  position: relative;
}
#eachClassFooter .otherClass .listWrap .classList li.thisClass a:before {
  content: '';
  width: 100%;
  height: 100%;
  background: rgba(31,31,31,0.4);
  position: absolute;
  top: 0;
  left: 0;
}

#eachClassFooter .otherClass .listWrap .classList li a .iconArea {
  display: inline-block;
  vertical-align: middle;
  width: 37.03703703703704%;
  padding: 3.703703703703704%;
}
#eachClassFooter .otherClass .listWrap .classList li a .txtArea {
  display: inline-block;
  vertical-align: middle;
  width: 62.96296296296296%;
  padding-right: 3.703703703703704%;
  text-align: center;
}
#eachClassFooter .otherClass .listWrap .classList li a .txtArea .className {
  font-size: 1.6rem;
  color: #333;
}
#eachClassFooter .otherClass .listWrap .classList li a .txtArea .className .tabDblock {
  display: none;
}

@media screen and (max-width: 1024px) {
  #eachClassFooter .otherClass .listWrap .classList li a .txtArea .className {
    text-align: left;
    line-height: 1.5;
  }
  #eachClassFooter .otherClass .listWrap .classList li a .txtArea .className .tabDblock {
    display: block;
  }
}

@media screen and (max-width: 767px) {
  #eachClassFooter {
    display: none;
  }
}


/* =====================================================
  追従ボタン
===================================================== */
#flowBtnArea {
  width: 100%;
  background: #fff;
  border-top: 1px solid #ccc;
  border-bottom: 1px solid #ccc;
  position: fixed;
  left: 0;
  bottom: 0;
  z-index: 999;
  transition: .2s;
  display: none;
  opacity: 0;
}

#flowBtnArea .max-inner {
  padding: 7px 20px;
  position: relative;
  text-align: center;
  font-size: 0;
}
#flowBtnArea .logoArea {
  display: inline-block;
  vertical-align: middle;
  padding: 0px;
}
#flowBtnArea .logoArea .logo {
  width: 45px;
}

#flowBtnArea .checkArea {
  max-width: 45%;
  display: inline-block;
  vertical-align: middle;
  padding-right: 60px;
  font-size: 0;
}
#flowBtnArea .checkArea .txt {
  max-width: 45%;
  display: inline-block;
  vertical-align: middle;
  font-size: 1.4rem;
}
#flowBtnArea .checkArea .btn {
  max-width: 50%;
  display: inline-block;
  width: 230px;
  margin-left: 20px;
  vertical-align: middle;
  border: 1px solid #00146e;
  background: #fff;
  border-radius: 4px;
}
#flowBtnArea .checkArea .btn:hover {
  background: #f0f3f8;
}
#flowBtnArea .checkArea .btn a {
  display: block;
  padding: 7px 45px 7px 30px;
  text-decoration: none;
  position: relative;
}
#flowBtnArea .checkArea .btn a:after {
  content: '';
  width: 10px;
  height: 10px;
  display: inline-block;
  border-top: 1px solid #00146e;
  border-right: 1px solid #00146e;
  transform: rotate(45deg);
  position: absolute;
  top: 50%;
  right: 30px;
  margin-top: -6px;
}

#flowBtnArea .checkArea .btn .btnTxt {
  font-size: 1.4rem;
  color: #00146e;
}

#flowBtnArea .reservationArea {
  max-width: 45%;
  display: inline-block;
  vertical-align: middle;
  font-size: 0;
}
#flowBtnArea .reservationArea .txt {
  max-width: 45%;
  display: inline-block;
  vertical-align: middle;
  font-size: 1.4rem;
}
#flowBtnArea .reservationArea .btn {
  max-width: 50%;
  display: inline-block;
  width: 230px;
  margin-left: 20px;
  vertical-align: middle;
  background: #d54100;
  border: 1px solid #d54100;
  border-radius: 4px;
}
#flowBtnArea .reservationArea .btn:hover {
  background: #c33c00;
}
#flowBtnArea .reservationArea .btn a {
  display: block;
  padding: 7px 45px 7px 30px;
  text-decoration: none;
  position: relative;
}
#flowBtnArea .reservationArea .btn a:after {
  content: '';
  width: 10px;
  height: 10px;
  display: inline-block;
  border-top: 1px solid #fff;
  border-right: 1px solid #fff;
  transform: rotate(45deg);
  position: absolute;
  top: 50%;
  right: 30px;
  margin-top: -6px;
}
#flowBtnArea .reservationArea .btn .btnTxt {
  font-size: 1.4rem;
  color: #fff;
}
#flowBtnArea .closeBtn {
  display: inline-block;
  width: 25px;
  height: 25px;
  border: none;
  cursor: pointer;
  position: absolute;
  top: 10px;
  right: 28px;
}
#flowBtnArea .closeBtn .btnInner {
  display: block;
  font-size: 0;
  position: relative;
}
#flowBtnArea .closeBtn .btnInner:before,#flowBtnArea .closeBtn .btnInner:after {
  content: '';
  display: inline-block;
  width: 2px;
  height: 17px;
  background: #333;
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  margin: auto;
  transform: rotate(45deg);
}
#flowBtnArea .closeBtn .btnInner:after {
  transform: rotate(-45deg);
}


@media screen and (min-width: 1025px) and (max-width: 1199px) {
  #flowBtnArea .logoArea {
    padding: 0 20px 0 10px;
  }
  #flowBtnArea .checkArea {
    padding-right: 20px;
  }
  #flowBtnArea .checkArea .btn,
  #flowBtnArea .reservationArea .btn {
    margin-left: 12px;
  }

}
@media screen and (min-width: 768px) and (max-width: 1024px) {
  #flowBtnArea .max-inner {
    padding: 7px 15px;
  }
  #flowBtnArea .logoArea {
    padding: 0 12px 0 0;
  }
  #flowBtnArea .logoArea .logo {
    width: 50px;
  }
  #flowBtnArea .checkArea {
    padding-right: 12px;
  }
  #flowBtnArea .checkArea .txt,
  #flowBtnArea .reservationArea .txt {
    font-size: 1.2rem;
  }
  #flowBtnArea .checkArea .btn,
  #flowBtnArea .reservationArea .btn {
    width: 110px;
    margin-left: 8px;
  }
  #flowBtnArea .checkArea .btn a {
    padding: 7px 30px 7px 14px;
  }
  #flowBtnArea .reservationArea .btn a {
    padding: 7px 30px 7px 14px;
  }
  #flowBtnArea .checkArea .btn a:after,
  #flowBtnArea .reservationArea .btn a:after {
    width: 8px;
    height: 8px;
    right: 20px;
    margin-top: -5px;
  }
}
@media screen and (min-width: 768px) and (max-width: 800px) {
  #flowBtnArea .closeBtn {
    top: 10px;
    right: 10px;
  }
}



/* =====================================================
  ページトップボタン
===================================================== */
.global-pagetop-box {
  bottom: 55px !important;
}
.global-pagetop-box.is-bottom {
  bottom: 0 !important;
}
@media screen and (max-width: 767px) {
  .global-pagetop-box {
    bottom: 40px !important;
  }
}

/* =====================================================
  オプショナルサービス
===================================================== */

#optionalServiceArea {
/*  margin-top: 100px; */
  background: #f0f0f0;
}
.mainContWrap + #optionalServiceArea {
    margin-top: 100px; 
}
#optionalServiceArea .max-inner {
  padding: 0 20px;
}

#optionalServiceArea .serviceHead {
  padding: 50px 0;
}
#optionalServiceArea .serviceHead .headTxt {
  text-align: center;
  font-size: 2.8rem;
  line-height: 1.333;
}

#optionalServiceArea .serviceWrap {
  padding-bottom: 40px;
}
#optionalServiceArea .serviceWrap .serviceList {
  overflow: hidden;
}
#optionalServiceArea .serviceWrap .serviceList .item {
  float: left;
  width: 22.5%;
  margin-right: 3.333333333333333%;
  margin-bottom: 3.333333333333333%;
}
#optionalServiceArea .serviceWrap .serviceList .item:nth-of-type(4n) {
  margin-right: 0;
}
#optionalServiceArea .serviceWrap .serviceList .item a {
  display: block;
  text-decoration: none;
  color: #000;
}
#optionalServiceArea .serviceWrap .serviceList .item:hover .imageArea img {
  opacity: 0.7;
}
#optionalServiceArea .serviceWrap .serviceList .item .txtArea {
  margin-top: 10px;
}
#optionalServiceArea .serviceWrap .serviceList .item .txtArea .serviceTitle .ttlTxt {
  margin-top: 6px;
  padding-left: 17px;
  font-size: 1.6rem;
  font-weight: bold;
  position: relative;
  line-height: 1.364;
}
#optionalServiceArea .serviceWrap .serviceList .item .txtArea .serviceTitle .ttlTxt:before {
  content: '';
  display: inline-block;
  width: 8px;
  height: 8px;
  border-top: 1px solid #000;
  border-right: 1px solid #000;
  transform: rotate(45deg);
  position: absolute;
  top: 5px;
  left: 0;
}
#optionalServiceArea .serviceWrap .serviceList .item:hover .txtArea .serviceTitle .ttlTxt {
  text-decoration: underline;
}

#optionalServiceArea .serviceWrap .serviceList .item .txtArea .detail {
  margin-top: 6px;
}
#optionalServiceArea .serviceWrap .serviceList .item .txtArea .detail .detailTxt {
  font-size: 1.4rem;
  line-height: 1.5;
}


@media screen and (max-width: 767px) {

  #optionalServiceArea .max-inner {
    padding: 0 15px;
  }

  #optionalServiceArea .serviceHead {
    display: block;
    padding: 30px 30px 30px 0;
    position: relative;
    text-decoration: none;
    color: #333;
    cursor: pointer;
  }

  #optionalServiceArea .serviceHead:after {
    content: '';
    display: inline-block;
    width: 10px;
    height: 10px;
    border-right: 1px solid #333;
    border-bottom: 1px solid #333;
    transform: rotate(45deg);
    position: absolute;
    top: 50%;
    right: 10px;
    margin-top: -5px;
  }
  #optionalServiceArea .serviceHead.accAct:after {
    transform: rotate(-135deg);
    margin-top: -1px;
  }
  #optionalServiceArea .serviceHead .headTxt {
    font-size: 1.6rem;
    line-height: 1.364;
  }

  #optionalServiceArea .serviceWrap .serviceList .item {
    width: 48%;
    margin-right: 4%;
    margin-bottom: 4%;
  }
  #optionalServiceArea .serviceWrap .serviceList .item:nth-of-type(2n) {
    margin-right: 0;
  }



}



/* =====================================================
  SPメニュー
===================================================== */

body.spMenuAct {
  height: 100%;
  position: fixed;
}

#header-drawer-nav.asw-header__drawer-nav {
  z-index: 10010;
}

#spMenu {
  display: none;
  width: 100%;
  height: 95px;
  position: fixed;
  bottom: 0;
  left: 0;
  z-index: 10000;
  padding-top: 10px;
}
@media screen and (max-width: 767px) {#spMenu {display: block;}}


#spMenu .closedTxt {
  background: #1f1f1f;
  height: 200px;
}
#spMenu .closedTxt a {
  display: block;
  padding: 6px 15px;
}
#spMenu .closedTxt a .txt {
  display: inline-block;
  padding-left: 24px;
  font-size: 1.6rem;
  color: #fff;
  position: relative;
}
#spMenu .closedTxt a .txt:before {
  content: '';
  display: inline-block;
  width: 9px;
  height: 9px;
  border-top: 1px solid #fff;
  border-left: 1px solid #fff;
  transform: rotate(45deg);
  position: absolute;
  top: 10px;
  left: 0;
}

#spMenu.menuOn {
  padding-top: 0;
  overflow-y: scroll;
  background: #fff;
}
#spMenu.menuOn .closedTxt {
  display: none;
}

#spMenu .menuWrap {
  display: none;
}
#spMenu.menuOn .menuWrap {
  display: block;
  padding: 44px 0 50px;
}

#spMenu .menuWrap .wrapHead {
  height: 44px;
  width: 100%;
  padding: 11px  15px 8px 20px;
  overflow: hidden;
  border-bottom: 1px solid #b5b5b5;
  background: #fff;
  position: fixed;
  top: 100%;
  left: 0;
  z-index: 1;
}
#spMenu .menuWrap .wrapHead .backToTop {
  float: left;
  display: inline-block;
}
#spMenu .menuWrap .wrapHead .backToTop a {
  display: block;
  text-decoration: none;
  font-size: 0;
  line-height: 1;
}
#spMenu .menuWrap .wrapHead .backToTop a:before {
  content: '';
  display: inline-block;
  vertical-align: middle;
  width: 21px;
  height: 22px;
  background: url(/common-operation/serviceinfo/international/inflight/images/icon_back_top.png) left top no-repeat;
  background-size: contain;
  margin-right: 12px;
}

#spMenu .menuWrap .wrapHead .backToTop .txt {
  display: inline-block;
  font-size: 1.6rem;
  color: #333;
  vertical-align: middle;
}

#spMenu .menuWrap .wrapHead .closeBtn {
  float: right;
  display: inline-block;
  vertical-align: middle;
  width: 22px;
  height: 22px;
  position: relative;
  font-size: 0;
  cursor: pointer;
}
#spMenu .menuWrap .wrapHead .closeBtn button {
  width: 22px;
  height: 22px;
  font-size: 0;
  border-color: transparent;
}
#spMenu .menuWrap .wrapHead .closeBtn .partsA,
#spMenu .menuWrap .wrapHead .closeBtn .partsB {
  width: 25px;
  height: 2px;
  background: #333;
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  margin: auto;
}
#spMenu .menuWrap .wrapHead .closeBtn .partsA {
  transform: rotate(45deg);
}
#spMenu .menuWrap .wrapHead .closeBtn .partsB {
  transform: rotate(-45deg);
}

#spMenu .menuWrap .eachClassBlock .classList .classHead {
  background: #f4f5f7;
  border-bottom: 1px solid #b5b5b5;
}
#spMenu .menuWrap .eachClassBlock .classList .classHead a {
  display: table;
  table-layout: fixed;
  width: 100%;
  padding: 9px 15px 9px;
  text-decoration: none;
  color: #333;
}
#spMenu .menuWrap .eachClassBlock .classList .classHead a:before {
  content: '';
  display: table-cell;
  width: 32px;
  height: 32px;
  background-size: contain;
  background-position: left top;
  background-repeat: no-repeat;
}
#spMenu .menuWrap .eachClassBlock .classList .class-f .classHead a:before {background-image: url(/common-operation/serviceinfo/international/inflight/images/icon_first_class.png);}
#spMenu .menuWrap .eachClassBlock .classList .class-c .classHead a:before {background-image: url(/common-operation/serviceinfo/international/inflight/images/icon_business_class.png);}
#spMenu .menuWrap .eachClassBlock .classList .class-py .classHead a:before {background-image: url(/common-operation/serviceinfo/international/inflight/images/icon_premium_economy.png);}
#spMenu .menuWrap .eachClassBlock .classList .class-y .classHead a:before {background-image: url(/common-operation/serviceinfo/international/inflight/images/icon_economy_class.png);}

#spMenu .menuWrap .eachClassBlock .classList .classHead .className {
  display: table-cell;
  vertical-align: middle;
  width: 100%;
  padding-left: 20px;
}
#spMenu .menuWrap .eachClassBlock .classList .classHead .className .txt {
  font-size: 1.6rem;
  font-weight: bold;
}
#spMenu .menuWrap .eachClassBlock .classList .classHead .switchIcon {
  display: table-cell;
  width: 1.4rem;
  position: relative;
}
#spMenu .menuWrap .eachClassBlock .classList .classHead .switchIcon .partsA {
  display: inline-block;
  width: 1.4rem;
  height: 2px;
  background: #333;
  position: absolute;
  top: 14px;
  left: 0;
}
#spMenu .menuWrap .eachClassBlock .classList .classHead .switchIcon .partsB {
  display: inline-block;
  width: 2px;
  height: 14px;
  background: #333;
  position: absolute;
  top: 8px;
  left: 6px;

}
#spMenu .menuWrap .eachClassBlock .classList .act .classHead .switchIcon .partsB {
  animation: iconChange 0.5s ease 1;
  transform: rotate(90deg);
  opacity: 0;
}
@iconChange {
  0% {transform: rotate(0); opacity: 1;}
  99% {transform: rotate(90deg); opacity: 1;}
  100% {transform: rotate(90deg); opacity: 0;}
}

#spMenu .menuWrap .eachClassBlock .classList .serviceList {
  display: none;
}
#spMenu .menuWrap .eachClassBlock .classList .serviceList li {
  border-bottom: 1px solid #b5b5b5;
}
#spMenu .menuWrap .eachClassBlock .classList .serviceList li a {
  display: table;
  table-layout: fixed;
  width: 100%;
  padding: 11px 14px 11px;
  text-decoration: none;
  color: #333;
}
#spMenu .menuWrap .eachClassBlock .classList .serviceList li a .iconBlock {
  display: table-cell;
  width: 30px;
  height: 22px;
  text-align: center;
  vertical-align: middle;
}
#spMenu .menuWrap .eachClassBlock .classList .serviceList li a .iconBlock .iconInner {
  display: inline-block;
  line-height: 0;
  vertical-align: middle;
}
#spMenu .menuWrap .eachClassBlock .classList .serviceList li.service-ground a .iconBlock .iconInner svg {
  width: 19px;
  height: 20px;
}
#spMenu .menuWrap .eachClassBlock .classList .serviceList li.service-lounge a .iconBlock .iconInner svg {
  width: 22px;
  height: 20px;
}
#spMenu .menuWrap .eachClassBlock .classList .serviceList li.service-seat a .iconBlock .iconInner svg {
  width: 16px;
  height: 22px;
}
#spMenu .menuWrap .eachClassBlock .classList .serviceList li.service-meal a .iconBlock .iconInner svg {
  width: 28px;
  height: 17px;
}
#spMenu .menuWrap .eachClassBlock .classList .serviceList li.service-wifi a .iconBlock .iconInner svg {
  width: 30px;
  height: 22px;
}
#spMenu .menuWrap .eachClassBlock .classList .serviceList li.service-dutyfree a .iconBlock .iconInner svg {
  width: 16px;
  height: 19px;
}
#spMenu .menuWrap .eachClassBlock .classList .serviceList li.service-amenity a .iconBlock .iconInner svg {
  width: 30px;
  height: 22px;
}
#spMenu .menuWrap .eachClassBlock .classList .serviceList li a .txtBlock {
  display: table-cell;
  width: 100%;
  padding-left: 22px;
  position: relative;
  vertical-align: middle;
}
#spMenu .menuWrap .eachClassBlock .classList .serviceList li a .txtBlock:after {
  content: '';
  width: 8px;
  height: 8px;
  display: inline-block;
  border-top: 1px solid #333;
  border-right: 1px solid #333;
  transform: rotate(45deg);
  position: absolute;
  top: 50%;
  right: 0;
  margin-top: -4px;
}
#spMenu .menuWrap .eachClassBlock .classList .serviceList li a .txtBlock .txt {
  font-size: 1.4rem;
}

#spMenu .res-btn-link {
  margin-top: 20px
}
#spMenu .res-btn-link a {
  line-height: 1.3;
  position: relative;
  display: block;
  width: 100%;
  padding: 20px 26px 20px 30px;
  cursor: pointer;
  text-decoration: none!important;
  color: #fff;
  border-width: 1px;
  border-style: solid;
  border-radius: 4px;
  font-size: 1.4rem;
}
#spMenu .res-btn-link a:after {
  font-family: icoset;
  font-size: 1.8rem;
  font-weight: 400;
  font-style: normal;
  font-variant: normal;
  line-height: 1;
  position: absolute;
  top: 50%;
  margin-top: -9px;
  content: "\e906";
  text-transform: none;
  pointer-events: none;
  color: #fff;
  speak: none;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale
}
#spMenu .res-btn-link a:hover:after {
  -webkit-animation-name: a;
  animation-name: a;
  -webkit-animation-duration: .5s;
  animation-duration: .5s;
  -webkit-animation-timing-function: ease-out;
  animation-timing-function: ease-out
}
#spMenu .res-btn-link a span {
  pointer-events: none
}
#spMenu .res-btn-link .btn-text {
  display: block;
  padding-right: 20px;
  text-align: center
}
#spMenu .res-btn-link.arrow-R a:after {
  right: 25px
}
#spMenu .res-btn-link.arrow-R .btn-text {
  padding-right: 26px
}
#spMenu .res-btn-link.type-01 a {
  width: 85%;
  min-width: 200px;
  margin: 0 auto
}
#spMenu .res-btn-link.ORA a {
  border-color: #d54100;
  background: #d54100
}
#spMenu .res-btn-link.ORA a:hover {
  border-color: #c33c00;
  background: #c33c00
}
#spMenu .res-btn-link.WBLU a {
  color: #00146e;
  border-color: #bec3da;
  background: #fff
}
#spMenu .res-btn-link.WBLU a:after {
  color: #00146e
}
#spMenu .res-btn-link.WBLU a:hover {
  background: #f0f3f8
}

/* =====================================================
  ページトップに戻る
===================================================== */
.toTopBtn {
  display: inline-block;
  width: 41px;
  height: 41px;
  background: #000;
  position: fixed;
  right: 10px;
  bottom: -41px;
  z-index: 10;
  box-shadow: -2px -2px 5px -2px #fff inset;
  cursor: pointer;
  transition: .2s;
}
.toTopBtn.on {
  bottom: 40px;
}
.toTopBtn a {
  display: block;
  width: 41px;
  height: 41px;
  position: relative;
}
.toTopBtn a:before {
  content: '';
  display: inline-block;
  width: 14px;
  height: 14px;
  border-left: 1px solid #fff;
  border-top: 1px solid #fff;
  transform: rotate(45deg);
  position: absolute;
  top: 50%;
  left: 50%;
  margin-top: -3px;
  margin-left: -6px;
}





/* ===================================================
  メインビジュアル
=================================================== */
.mainVisual {
  margin: 0 !important;
  background-position: 50% top;
  background-repeat: no-repeat;
  background-size: auto;
  background-color: #fff;
  padding: 0 !important;
  position: relative;
}
.cp-container-child {
  max-width: 1200px;
  padding: 0;
}

.cp-container-child .headArea {
  display: table;
  table-layout: fixed;
  width: 44%;
  position: absolute;
  top: 50%;
  left: 56%;
  margin-top: -47px;
}
.cp-container-child .headArea .headArea_inner {
  display: table-cell;
  height: 100%;
  width: 100%;
  vertical-align: middle;
}
.cp-container-child .headArea .logo {
  display: table-cell;
  vertical-align: top;
  width: 93px;
}
.cp-container-child .headArea .txtArea {
  display: table-cell;
  padding-left: 5.3%;
  vertical-align: top;
}
.cp-container-child .headArea .txtArea .classNameTxt {
  font-size: 2rem;
  color: #fff;
}

.class_economy .cp-container-child .headArea .txtArea .classNameTxt,
.class_premium_economy .cp-container-child .headArea .txtArea .classNameTxt {
  font-size: 2rem;
  color: #333;
}

.cp-container-child .headArea .txtArea .mainTxt {
  margin-top: 3px;
  font-size: 3.8rem;
  color: #fff;
  line-height: 1.2;
}

.class_economy .cp-container-child .headArea .txtArea .mainTxt,
.class_premium_economy .cp-container-child .headArea .txtArea .mainTxt {
  color: #333;
}

.cp-container-child .headArea .txtArea span {
  display: block;
}
.mainCaption {
  margin-top: 10px;
}

@media screen and (min-width: 768px) and (max-width: 1200px) {
  .cp-container-child .headArea .txtArea .mainTxt {
    font-size: 3.2vw;
  }
}

@media screen and (max-width: 767px) {
  .mainVisual {
    width: 100%;
    background-size: cover;
  }
  .cp-container-child .headArea {
    width: 100%;
    padding: 4%;
    position: static;
    margin-top: 0;
    background-size: cover;
    background-position: left top;
    background-repeat: no-repeat;
  }

  .class_first .mainVisual .headArea {
    background-image: url(/common-operation/serviceinfo/international/inflight/images/bg_main_ttl_f.jpg);
  }
  .class_business .mainVisual .headArea {
    background-image: url(/common-operation/serviceinfo/international/inflight/images/bg_main_ttl_c.jpg);
  }
  .class_premium_economy .mainVisual .headArea {
    background-image: url(/common-operation/serviceinfo/international/inflight/images/bg_main_ttl_py.jpg);
  }
  .class_economy .mainVisual .headArea {
    background-image: url(/common-operation/serviceinfo/international/inflight/images/bg_main_ttl_y.jpg);
  }


  .cp-container-child .headArea .logo {
    width: 16%;
  }
  .cp-container-child .headArea .txtArea {
    padding-left: 3.3%;
  }
  .cp-container-child .headArea .txtArea .classNameTxt {
    font-size: 4.2vw;
    line-height: 1;
  }
  .cp-container-child .headArea .txtArea .mainTxt {
    margin-top: 11px;
    font-size: 7vw;
  }
  .mainCaption {
    font-size: 1.4rem;
    line-height: 1.428571428571429;
  }
}


/* ===================================================
  sectionHead
=================================================== */
.sectionHead {
  margin-top: 90px;
}
.sectionHead .headInner {
  text-align: center;
  font-size: 0;
}
.sectionHead .headInner:after {
  content: '';
  display: inline-block;
  width: 256px;
  height: 2px;
}
.sectionHead .headInner .headTxt {
  padding-bottom: 20px;
  font-size: 3rem;
  line-height: 1.5;
}
.sectionHead .headInner .headTxt.en {
  font-family: ヒラギノ角ゴ Pro W3,Hiragino Kaku Gothic Pro,メイリオ,Meiryo,verdana,ＭＳ\ Ｐゴシック,Osaka,sans-serif;
}

.sectionHead .headInner .headTxt .middle_ttl {
  display: block;
  font-size: 2rem;
}

.sectionHead .headInner:after {
  background: -moz-linear-gradient(left, rgba(255,255,255,0) 0%, rgba(177,206,235,1) 32%, rgba(133,178,224,1) 50%, rgba(177,206,235,1) 68%, rgba(255,255,255,0) 100%); /* FF3.6-15 */
  background: -webkit-linear-gradient(left, rgba(255,255,255,0) 0%,rgba(177,206,235,1) 32%,rgba(133,178,224,1) 50%,rgba(177,206,235,1) 68%,rgba(255,255,255,0) 100%); /* Chrome10-25,Safari5.1-6 */
  background: linear-gradient(to right, rgba(255,255,255,0) 0%,rgba(177,206,235,1) 32%,rgba(133,178,224,1) 50%,rgba(177,206,235,1) 68%,rgba(255,255,255,0) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#00ffffff', endColorstr='#00ffffff',GradientType=1 ); /* IE6-9 */
}

@media screen and (max-width: 767px) {
  .sectionHead {
    margin-top: 70px;
  }
  .sectionHead .headInner:after {
    width: 130px;
  }
  .sectionHead .headInner .headTxt {
    padding-bottom: 13px;
    font-size: 2.4rem;
    line-height: 1.2;
  }
}


/* ===================================================
  bdrHead
=================================================== */
.bdrHead {
  max-width: 1200px;
  margin: 50px auto 0;
}
.bdrHead .headInner {
  padding-bottom: 15px;
  border-bottom: 1px solid #b2b2b2;
  text-align: center;
}
.bdrHead .headInner .headTxt {
  font-size: 2.4rem;
  line-height: 1.25;
}
.bdrHead .headInner .headTxt .en {
  font-size: 3rem;
}

@media screen and (max-width: 768px) {
  .bdrHead {
    margin-top: 50px;
  }
  .bdrHead .headInner .headTxt {
    font-size: 2rem;
  }
  .bdrHead .headInner .headTxt .en {
    font-size: 2.4rem;
  }
}



/* ===================================================
  スライダー
=================================================== */

/* スライダー調整 --------------------------------------------------*/
.slick-prev, .slick-next {
  width: 30px;
  height: 100px;
  background: rgba(51,51,51,0.8);
  z-index: 5;
}
.slick-prev {
  left: 0;
}
.slick-next {
  right: 0;
}
.slick-prev:hover, .slick-prev:focus, .slick-next:hover, .slick-next:focus {
  background: rgba(51,51,51,0.6);
}
.slick-prev:before,
.slick-next:before {
  content: '';
  width: 10px;
  height: 10px;
  display: inline-block;
  transform: rotate(45deg);
}
.slick-prev:before {
  border-left: 1px solid #fff;
  border-bottom: 1px solid #fff;
  margin-right: -2px;
}
.slick-next:before {
  border-top: 1px solid #fff;
  border-right: 1px solid #fff;
  margin-left: -2px;
}
.slick-dotted.slick-slider {
  margin-bottom: 53px;
}
.slick-dots-wrap {
  width: 100%;
  text-align: center;
  position: absolute;
  bottom: -50px;
  font-size: 0;
}
.slick-dots {
  display: inline-block;
  width: auto;
  position: static;
}
.slick-dots li {
  width: 16px;
  height: 16px;
  margin: 0 10px;
}
.slick-dots li button {
  width: 100%;
  height: 100%;
}
.slick-dots li button:before {
  content: '';
  opacity: 1;
  width: 100%;
  height: 100%;
  border-radius: 50%;
  background: #fff;
  border: 1px solid #00146e;
  box-sizing: border-box;
}
.slick-dots li.slick-active button:before {
  background: #00146e;
  border: none;
}
.playToggle {
  display: inline-block;
  height: 30px;
  margin-right: 10px;
  padding-top: 5px;
  padding-right: 18px;
  border: none;
  border-right: 1px solid #00146e;
  vertical-align: middle;
  background: none;
}
.playToggle .startBtn {
  display: inline-block;
  width: 20px;
  height: 20px;
  text-align: center;
  vertical-align: top;
  cursor: pointer;
}
.playToggle .stopBtn {
  display: inline-block;
  width: 20px;
  height: 20px;
  text-align: center;
  vertical-align: top;
  cursor: pointer;
}
.playToggle .startBtn:before {
  content: '';
  display: inline-block;
  border-top:9px solid transparent;
  border-left:14px solid #00146e;
  border-bottom:9px solid transparent;
}
.playToggle .stopBtn:before,
.playToggle .stopBtn:after {
  content: '';
  display: inline-block;
  width: 4px;
  height: 20px;
  margin-right: 4px;
  background: #00146e;
}
.playToggle .stopBtn:after {
  margin-right: 0;
}

@media screen and (max-width: 767px) {
  .slick-prev,
  .slick-next {
    width: 23px;
    height: 75px;
  }
  .slick-dots-wrap {
    bottom: -38px;
  }
  .playToggle {
    height: 25px;
  }
  .playToggle .stopBtn,
  .playToggle .startBtn {
    width: 20px;
    height: 20px;
  }
  .playToggle .startBtn:before {
    border-top: 9px solid transparent;
    border-left: 16px solid #00146e;
    border-bottom: 9px solid transparent;
  }
  .playToggle .stopBtn:before,
  .playToggle .stopBtn:after {
    width: 3px;
    height: 20px;
  }
  .playToggle .stopBtn:before {
    margin-right: 5px;
  }
  .slick-dots li {
    width: 11px;
    height: 11px;
  }
}
.slideItem {
  list-style: none;
}
/* ===================================================
  2カラムスライダー
=================================================== */
.colType-2-Slide {
  overflow: hidden;
}
.colType-2-Slide .slick-list {
  margin-right: -2.5%;
}
.colType-2-Slide .slideItem {
  float: left;
  width: 48.5%;
  margin-right: 3%;
}
.colType-2-Slide .slideItem:nth-of-type(2n) {
   margin-right: 0;
}
.colType-2-Slide .slick-list .slideItem {
  margin-right: 0.5%;
}

.colType-2-Slide .slideItem img {
  width: 100%;
}
@media screen and (max-width: 767px) {
  .colType-2-Slide .slick-list {
    margin-right: 0;
  }
  .colType-2-Slide .slideItem {
    width: 100%;
    margin-right: 0 !important;
  }
}


/* ===================================================
  3カラムスライダー
=================================================== */
.colType-3-Slide {
  overflow: hidden;
}
.colType-3-Slide .slick-list {
  margin-right: -3.3%;
}
.colType-3-Slide .slideItem {
  float: left;
  width: 30%;
  margin-right: 3.33333%;
}
.colType-3-Slide .slideItem:nth-of-type(3n) {
   margin-right: 0;
}
.colType-3-Slide .slick-list .slideItem {
  margin-right: 30px;
}
.colType-3-Slide .slideItem img {
  width: 100%;
}
@media screen and (max-width: 767px) {
  .colType-3-Slide .slick-list {
    margin-right: 0;
  }
  .colType-3-Slide .slideItem {
    width: 100%;
    margin-right: 0 !important;
  }
}


/* ===================================================
  spアコーディオン
=================================================== */
.spAccBox .accToggleArea {
  display: none;
}

@media screen and (max-width: 767px) {
  .spAccBox {
    margin-top: 40px;
    overflow: hidden;
    position: relative;
  }
  .spAccBox:before {
    content: '';
    display: block;
    width: 102%;
    height: 102%;
    position: absolute;
    top: 0;
    left: 0;
    z-index: 10;
    background: -moz-linear-gradient(top, rgba(255,255,255,0) 0%, rgba(255,255,255,0) 5%, rgba(255,255,255,1) 88%, rgba(255,255,255,1) 100%); /* FF3.6-15 */
    background: -webkit-linear-gradient(top, rgba(255,255,255,0) 0%,rgba(255,255,255,0) 5%,rgba(255,255,255,1) 88%,rgba(255,255,255,1) 100%); /* Chrome10-25,Safari5.1-6 */
    background: linear-gradient(to bottom, rgba(255,255,255,0) 0%,rgba(255,255,255,0) 5%,rgba(255,255,255,1) 88%,rgba(255,255,255,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#00ffffff', endColorstr='#ffffff',GradientType=0 ); /* IE6-9 */
  }
  .spAccBox.open:before {
    content: none;
  }
  .spAccBox .accCont {
    padding-bottom: 10px;
  }
  .spAccBox .accCont > div:first-child {
    margin-top: 0 !important;
  }

  .spAccBox .accToggleArea {
    display: block;
    width: 100%;
    position: absolute;
    left: 0;
    bottom: 0;
    z-index: 10;
    text-align: center;
  }
  .spAccBox.open .accToggleArea {
    margin-top: 38px;
    position: static;
  }
  .spAccBox .accToggleArea .toggleBtn {
    display: inline-block;
    width: 173px;
    padding: 13px;
    border-top: 1px solid #b2b2b2;
    border-bottom: 1px solid #b2b2b2;
    cursor: pointer;
  }
  .spAccBox .accToggleArea .toggleBtn .btnTxt {
    display: inline-block;
    padding-right: 27px;
    font-size: 1.6rem;
    color: #333;
    position: relative;
  }
  .spAccBox .accToggleArea .toggleBtn .btnTxt:after {
    content: '';
    display: inline-block;
    width: 10px;
    height: 10px;
    border-right: 1px solid #333;
    border-bottom: 1px solid #333;
    transform: rotate(45deg);
    position: absolute;
    top: 50%;
    right: 2px;
    margin-top: -8px;
  }
  .spAccBox.open .accToggleArea .toggleBtn .btnTxt:after {
    transform: rotate(-135deg);
    margin-top: -4px;
  }
  .spAccBox .accToggleArea .toggleBtn .btnTxt .openTxt {
    display: none;
  }
  .spAccBox.open .accToggleArea .toggleBtn .btnTxt .openTxt {
    display: block;
    color: #333;
  }
  .spAccBox.open .accToggleArea .toggleBtn .btnTxt .cloceTxt {
    display: none;
  }
}


/* ===================================================
  関連サービス 2カラム
=================================================== */
.emphasis_ttl {
  font-size: 2.4rem;
  letter-spacing: -1px;
}
.relationCol .emphasis_ttl + p {
  margin-top: 30px;
}
.relationCol .linkTypeBtn {
  margin-top: 60px;
}
.relationCol .linkTypeBtn a {
  max-width: 459px;
  padding: 18px 45px 18px;
  font-size: 2rem;
}

@media screen and (max-width: 767px) {
  .emphasis_ttl {
    font-size: 2rem;
  }
  .relationCol .emphasis_ttl + p {
    margin-top: 0;
  }
  .relationCol .linkTypeBtn a {
    max-width: none;
    font-size: 1.5rem;
  }
}
/* ===================================================
  カラムボックス
=================================================== */
.colWrap {
  margin-top: 50px;
}
.colWrapInner + .colWrapInner {
  margin-top: 70px;
}
.colWrapInner {
  overflow: hidden;
  max-width: 1200px;
  width: 100%;
  margin: 0 auto;
}
.colWrap .colWrapInner > .right {
  float: right;
}
.colWrap .colWrapInner > .left {
  float: left;
}
.colWrap .pd_R20 {
  padding-right: 20px;
}
.colWrap .pd_L20 {
  padding-left: 20px;
}
.colWrap .pd_R30 {
  padding-right: 30px;
}
.colWrap .pd_L30 {
  padding-left: 30px;
}
.colWrap2 {
  width: 50%;
}
.howto_step .colWrap2.text {
  width: 55%;
}
.howto_step .colWrap2.thumb {
  width: 45%;
}
.colWrap3 {
  width: calc((100% - 80px)/3);
  margin-right: 40px;
}
.colWrap3:nth-child(3n) {
  margin-right: 0;
}

@media screen and (max-width: 1200px) {
  .colWrap {
    padding: 0 20px;
  }
}

@media screen and (max-width: 767px) {
  .colWrap {
    margin-top: 40px;
    padding: 0;
  }
  .max-inner .colWrap {
    padding: 0;
  }
  .colWrap p {
    font-size: 1.6rem;
  }
  .colWrap2 {
    width: 100% !important;
  }
  .colWrap .right {
    float: none;
  }
  .colWrap .left {
    float: none;
  }
  .colWrap .pd_R20 {
    padding-right: 0;
  }
  .colWrap .pd_L20 {
    padding-left: 0;
    margin-top: 30px;
  }
  .colWrap .pd_R30 {
    padding-right: 0;
  }
  .colWrap .pd_L30 {
    padding-left: 0;
    margin-top: 30px;
  }
  .howto_step .colWrap .pd_L30 {
    margin: 0 0 30px;
  }
  .colWrap .img {
    text-align: center;
  }
  .colWrap3 {
    margin-top: 40px;
    width: 100%;
  }
}

/* ===================================================
  バナーエリア
=================================================== */
.noticeBnrArea {
  margin-top: 60px;
  background: #f0f0f0;
  padding: 40px 20px;
}

.noticeBnrArea .bnrList {
  padding-top: 20px;
  font-size: 0;
  overflow: hidden;
}
.noticeBnrArea .bnrList li {
  float: left;
  width: 48.33333333333333%;
  margin: 0 3.333333333333333% 3.333333333333333% 0;
  transition: .2s;
}
.noticeBnrArea .bnrList li:nth-of-type(2n) {
  margin-right: 0;
}
.noticeBnrArea .bnrList li:hover {
  opacity: 0.7;
}
.noticeBnrArea .bnrList a {
  display: block;
}
.noticeBnrArea .bnrList img {
  width: 100%;
}
.noticeBnrArea .bnrList.wide li {
  width: 100%;
  margin-right: 0;
}
@media screen and (max-width: 767px) {
  .noticeBnrArea {
    padding: 27px 0 12px;
  }
  .noticeBnrArea .bnrList {
    padding-top: 0;
  }
  .noticeBnrArea .bnrList li {
    width: 100%;
    margin: 0 0 4.35% 0;
  }
}


/* ===================================================
  トグルスイッチボタン
=================================================== */
.switchTab {
  margin-top: 50px;
}
.switchTab .switchTabInner {
  max-width: 538px;
  margin: 0 auto;
  background: #1f1f1f;
  border: 1px solid #1f1f1f;
  border-radius: 50px;
  position: relative;
  padding: 1px;
}
.switchTab .monthBg {
  position: relative;
  display: table;
  width: 100%;
  table-layout: fixed;
}
.switchTab .monthBg:after {
  content: "";
  width: 100%;
  max-width: 50%;
  height: 100%;
  background: #fff;
  border: 4px solid #1f1f1f;
  border-radius: 50px;
  box-sizing: border-box;
  display: block;
  position: absolute;
  z-index: 0;
  transition: .4s;
}
.switchTab .monthBg.now:after {
  transform: translateX(-200%);
}
.switchTab .monthBg.next:after {
  transform: translateX(-100%);
}
.switchTab .month.active {
  cursor: initial;
}
.switchTab .monthBg a:hover {
  text-decoration: none;
}
.switchTab .month {
  display: table-cell;
  width: 50%;
  vertical-align: middle;
  padding: 13px 15px 10px;
  cursor: pointer;
  transition: .4s;
  position: relative;
  z-index: 1;
}
.switchTab .txt {
  font-size: 2.4rem;
  color: #fff;
  text-align: center;
  z-index: 99999;
  line-height: 1;
  transition: .4s
}
.switchTab .active .txt {
  color: #333;
}
.monthNextContent {
  display: none;
}
@media screen and (max-width: 767px) {
  .switchTab {
    margin-top: 40px;
    padding: 0 10px;
  }
  .switchTab .txt {
    font-size: 1.5rem;
  }
}


/* ===================================================
  関連リンク
=================================================== */
.linkBtnArea {
  margin-top: 50px;
}
.linkBtnArea .linkList {
  font-size: 0;
  text-align: center;
}
.linkBtnArea .linkList .btn {
  display: inline-block;
  margin-left: 20px;
  margin-bottom: 20px;
  background: #00146e;
  border-radius: 4px;
  transition: .2s;
}
.linkBtnArea .linkList .btn:first-child {
  margin-left: 0;
}
.linkBtnArea .linkList .btn:hover {
  background: #0f2356;
}
.linkBtnArea .linkList .btn a {
  display: block;
  padding: 13px 45px 12px 30px;
  text-decoration: none;
  position: relative;
}
.linkBtnArea .linkList .btn a:after {
  content: '';
  display: inline-block;
  width: 10px;
  height: 10px;
  border-top: 1px solid #fff;
  border-right: 1px solid #fff;
  transform: rotate(45deg);
  position: absolute;
  top: 50%;
  right: 26px;
  margin-top: -7px;
}
.linkBtnArea .linkList .btn a .btnTxt {
  font-size: 1.6rem;
  color: #fff;
}

@media screen and (max-width: 768px) {
  .linkBtnArea {
    margin-top: 25px;
  }
  .linkBtnArea .linkList .btn {
    width: 100%;
    margin-left: 0;
    border-radius: 3px;
  }
  .linkBtnArea .linkList .btn a {
    padding: 14px 45px 14px 30px;
  }
  .linkBtnArea .linkList .btn a:after {
    width: 10px;
    height: 10px;
    margin-top: -7px;
  }

}


/* ===================================================
  リストビュレット
=================================================== */
.caution_list li:before {
  padding-right: 0.5em;
  display: inline-block;
  vertical-align: top;
  text-align: right;
}
.caution_list li:before {
  content: '\002a';
}
.caution_list_item_inner {
  display: inline-block;
  width: calc( 100% - 2.5em );
}


.res-main-back.app_box {
  padding: 0 30px;
  background-image: url(/common-operation/serviceinfo/international/inflight/images/wifi/myskychannel_img_002.png);
  background-repeat: no-repeat;
  background-position: 97% 0;
  background-size: auto;
}
.res-main-back.app_box .cp-box {
  margin-top: 22px;
}
.app_detail_ttl {
  font-weight: bold;
}
.cp-box > .app_btn {
  display: flex;
  width: 90%;
  justify-content: space-between;
}
.app_btn_list + .app_btn_list {
  margin-left: 21px;
}
.app_btn_list a {
  display: flex;
  align-items: baseline;
}
.app_btn_list a img {
  vertical-align: baseline;
}
.app_btn_list,
.app_btn_appstore,
.app_btn_googleplay {
  flex: 1\9; /* IE10以下 */
}
@media all and (-ms-high-contrast: none){
  .app_btn_list,
  .app_btn_appstore,
  .app_btn_googleplay {
    flex: 1; /* IE10以上 */
  }
}
.app_btn .ico-blank-img {
  display: block;
  width: 12px;
  height: 12px;
}

.colWrap .colWrapInner .img.no_border {
  border: none;
}

@media screen and (max-width: 1024px) {
  .res-main-back.app_box {
    margin: 0;
    padding: 0;
  }
  .cp-box > .app_btn {
    width: 80%;
  }
}
@media screen and (max-width: 767px) {
  .res-main-back.app_box {
    padding: 0 10px 30%;
    background-position: right 50% bottom -30%;
    background-size: auto 60%;
  }
  .res-main-back.app_box .cp-box {
    margin-bottom: 0;
  }
  .res-main-back.app_box .cp-box:last-child {
    align-items: center;
  }
  .app_btn_list + .app_btn_list {
    margin-left: 4%;
  }
}
@media screen and (max-width: 640px) {
  .res-main-back.app_box {
    background-size: auto 50%;
  }
}
@media screen and (max-width: 375px) {
  .app_btn_list + .app_btn_list {
    margin-left: 0;
  }
  .app_btn_list {
    width: 48%;
  }
  .app_btn_list a {
    justify-content: space-between;
  }
}

/* ===================================================
  モーダル動画
=================================================== */
.moveiModal .modalBtn {
  display: inline-block;
  width: 218px;
  margin-top: 26px;
  border: 1px solid #00146e;
  border-radius: 4px;
  cursor: pointer;
}
.moveiModal .modalBtn.no-text {
  width: 100%;
  max-width: 340px;
}
.moveiModal .modalBtn a {
  display: block;
  padding: 9px;
}
.moveiModal .modalBtn .txt {
  text-align: center;
}
.moveiModal .modalBtn .txt:before {
  content: '';
  display: inline-block;
  margin-right: 10px;
  width: 37px;
  height: 30px;
  background: url(/common-operation/serviceinfo/international/inflight/images/icon_movie_play.png) left top no-repeat;
  vertical-align: middle;
}
.moveiModal .modalBtn .txtInner {
  display: inline-block;
  font-size: 1.6rem;
  color: #00146e;
  vertical-align: middle;
}
@media screen and (max-width: 375px) {
  .moveiModal .modalBtn.no-text .txtInner {
		font-size: 1.4rem;
  }
}


/* モーダル --------------------------------------------------*/
.modalCont .modalContInner {
  padding: 15px;
  overflow: hidden;
}


/* 共通ナビゲーションoverwrite --------------------------------------------------*/
.asw-modal--active .asw-modal__container{
  z-index: 10020;
}


/* 20221013追加分 */
#eachClassHeader .classNavi > ul.naviList > li > a{
  border-right: 1px solid transparent;
  border-bottom: 5px solid transparent;
}
#eachClassHeader .classNavi > ul.naviList > li:first-child > a{
  border-right: 1px solid transparent;
}
