@charset "utf-8";
/*! ==============================================================================
 *  /ja/jp/hawaii24/lounge/css/style.css last update 2017.05.23
 * ===============================================================================

/*----------------------------------------
PC,SP common Layout
----------------------------------------*/
/*-----------------------------------
html,body etc
-----------------------------------*/
html{font-size: 10px; -webkit-overflow-scrolling: touch;}
body{font-size: 16px; font-family:"ヒラギノ角ゴ ProN W3", Hiragino Kaku Gothic ProN, Arial, "メイリオ", Meiryo, sans-serif; color: #333;}
.wrapper{overflow: hidden;}
.sectionBlock + .sectionBlock{margin-top: 100px;}

/*-----------------------------------
header
-----------------------------------*/
.headerBlock .mainVisual{position: relative; height: 100%;}
.headerBlock .mainVisual .mvImg img{width: 100%; height: auto;}
.headerBlock .mvInner{position: absolute; padding: 0 15px; top:5%; left: -10px; right: 0; max-width: 1200px; width: 100%; margin: auto;}
.headerBlock .mvInner .logo{width: 22.5%;}
.headerBlock .mainTitle{position: absolute; top:20.7%; left:0; right: 0; width: 24.2%; margin:0 auto;}
.headerBlock .mvReadBox{
  min-height: 480px; padding:  80px 15px 100px;
  background: url(/ja/jp/hawaii24/lounge/img/mv_bg_001.jpg) no-repeat center bottom; background-size: 100% auto;
  line-height: 2; text-align: center;
}

.headerBlock .mvReadBox .mvReadBoxTitle{
  max-width: 434px;
  width: 53%;
  margin: auto;
}

.headerBlock .mvReadBox .mvReadBoxTitle span{
  display: block;
  position: relative;
}

.headerBlock .mvReadBox .mvReadBoxTitle span::after{
  position: absolute;
  top:11%;
  right: -33%;
  margin: auto 0;
  content: "";
  width: 32%;
  max-width: 142px;
  height: 60px;
  background: url(/ja/jp/hawaii24/lounge/img/img_airplane.png) no-repeat left 0;
  background-size: contain;
}

.headerBlock .mvReadBox .mvReadBoxSubTitle{
  margin-top: 30px;
  font-size: 22px;
  color: #0173d3;
}

.headerBlock .mvReadBox .mvReadBoxNote{
  max-width: 1200px;
  margin: 20px auto 0;
  font-size: 14px;
  text-align: right;
}

.headerBlock .mvReadBox .mvReadBoxSubTitle + p{margin-top: 34px;}

/*-----------------------------------
mainArea
-----------------------------------*/
.mainArea{margin: 70px 0 0 0;}
.mainArea .mainAreaInner{max-width: 1200px; margin: 0 auto; padding-bottom: 100px;}

.mainAreaInner .column2Box{
  width: 100%;
  margin-top: 40px;
  display: flex;
  display: -webkit-flex;
  flex-wrap: wrap;
  -webkit-flex-wrap: wrap;
  justify-content: center;
  -webkit-justify-content: center;
  align-items: flex-start;
  -webkit-align-items: flex-start;
}

.mainAreaInner .column2Box:first-child{margin-top: 0;}
.mainAreaInner .targetCustomerBox + .column2Box{margin-top: 100px;}

.mainAreaInner .column2Box .column2Item{
  position: relative;
  z-index: 30;
  width: 48.3%;
  margin-left: 3.3%;
  line-height: 2;
}
.mainAreaInner .column2Box .column2Item:first-child,
.mainAreaInner .column2Box .column2Item:nth-child(2n+1){margin-left: 0;}
.mainAreaInner .column2Box + .column2Box{margin-top: 100px;}
.mainAreaInner .column2ItemTitle{max-width: 100%; margin:0 auto 30px auto;}
.mainAreaInner .column2ItemTitle.title01{max-width: 203px; margin-top: 57px;}
.mainAreaInner .column2ItemTitle.title02{max-width: 376px; margin-top: 0;}
.mainAreaInner .column2ItemTitle.title03{max-width: 256px;}
.mainAreaInner .column2ItemTitle.title04{max-width: 200px; margin-top: 0;}
.mainAreaInner .column2ItemTitle + p{padding: 0 10px; font-size: 14px; line-height: 2;}


.mainAreaInner .targetCustomerBox{
  position: relative;
  z-index: 100;
  margin-top: 40px;
  padding: 30px;
  border: 1px solid #ddd;
  background: #fff;
  font-size: 14px;
}

.mainAreaInner .targetCustomerBox p{
  width: 100%;
  line-height: 1.5;
}

.mainAreaInner .targetCustomerBox .targetCustomerTitle{
  width: 100%;
  margin-bottom: 20px;
  font-size: 18px;
  font-weight: bold;
}

.mainAreaInner .targetCustomerImgBox{
  display: flex;
  display: -webkit-flex;
  flex-wrap: wrap;
  -webkit-flex-wrap: wrap;
  align-items: center;
  -webkit-align-items: center;
  width: 100%;
  margin:0
}

.mainAreaInner .targetCustomerImgItem + .targetCustomerImgItem{display: flex; display: -webkit-flex; align-items: center; -webkit-align-items: center; margin-left: 12px;}
.mainAreaInner .targetCustomerTxtItem{
  position: relative;
  display: flex; display: -webkit-flex; align-items: center; -webkit-align-items: center;
  min-width: 104px;
  max-height: 41px;
  margin:10px 0 10px 38px;
  padding: 10px;
  border: 1px solid #d0d0d0;
  border-radius: 4px;
  font-size: 13px;
  background: #e3e3e3;
}

.mainAreaInner .targetCustomerTxtItem:before{
  position: absolute;
  top:50%;
  transform: translateY(-50%);
  bottom:0;
  left: -30px;
  content: url(/ja/jp/hawaii24/lounge/img/icon_plus_001.png);
}

.mainAreaInner .targetCustomerBox .column2Box{
  display: flex; display: -webkit-flex; align-items: center; -webkit-align-items: center;
  width: 47%;
  max-width: 580px;
}

.mainAreaInner .targetCustomerBox .targetCustomerBoxInner{
  display: flex;
  display: -webkit-flex;
  flex-wrap: wrap;
  -webkit-flex-wrap: wrap;
  align-items: flex-start;
  -webkit-align-items: flex-start;
}

.mainAreaInner .targetCustomerBox .targetCustomerBoxInner + .targetCustomerBoxInner{
  width: 100%;
  margin-top: 30px;
}

.mainAreaInner .targetCustomerBox .targetCustomerTxt{margin-top: 15px;}
.mainAreaInner .targetCustomerBox .column2Box + .column2Box{margin: 0 0 0 5%;}
.mainAreaInner .targetCustomerBox .column2Box:nth-child(2),
.mainAreaInner .targetCustomerBox .column2Box:first-child{margin-top: 0;}
.mainAreaInner .overviewList{line-height: 1; font-size: 14px;}
.mainAreaInner .overviewList dt{font-weight: bold;}
.mainAreaInner .overviewList dd{line-height: 2;}
.mainAreaInner .overviewList dd + dt{margin-top: 18px;}

[class*='bgDetail0']{position: relative;}
[class*='bgDetail0']::after,
[class*='bgDetail0']::before{position: absolute; content:''; z-index: -10;}

.bgDetail01::after{
  width: 40%;
  max-width: 215px;
  height: 190px;
  top:0;
  right:-47px;
  background:url(/ja/jp/hawaii24/lounge/img/bg_flower_001.png) no-repeat right top;
  background-size:contain;
}

.bgDetail01::before{
  width: 37%;
  max-width: 240px;
  height: 218px;
  top:50%;
  left:-15%;
  margin: auto;
  background:url(/ja/jp/hawaii24/lounge/img/bg_leaf_001.png) no-repeat 0 0;
  background-size:contain;
}

.bgDetail02::after{
  width: 40%;
  max-width: 240px;
  height: 190px;
  top:39%;
  right:-25%;
  background:url(/ja/jp/hawaii24/lounge/img/bg_leaf_002.png) no-repeat right top;
  background-size:contain;
}

.bgDetail02::before{
  width: 37%;
  max-width: 215px;
  height: 218px;
  top:0;
  left:-47px;
  margin: auto;
  background:url(/ja/jp/hawaii24/lounge/img/bg_flower_002.png) no-repeat 0 0;
  background-size:contain;
}

.bgDetail03::after{
  width: 40%;
  max-width: 240px;
  height: 190px;
  top:-215px;
  right:70px;
  background:url(/ja/jp/hawaii24/lounge/img/bg_flower_001.png) no-repeat right top;
  background-size:contain;
}

.bgDetail03::before{
  width: 37%;
  max-width: 276px;
  height: 218px;
  bottom:-130px;
  left:0;
  margin: auto;
  background:url(/ja/jp/hawaii24/lounge/img/bg_leaf_003.png) no-repeat 0 0;
  background-size:contain;
}

.bgDetail04::after{
  width: 40%;
  max-width: 240px;
  height: 190px;
  top:0;
  right:-47px;
  background:url(/ja/jp/hawaii24/lounge/img/bg_flower_001.png) no-repeat right top;
  background-size:contain;
}

.bgDetail04::before{
  width: 37%;
  max-width: 215px;
  height: 218px;
  top:31%;
  left:-15%;
  margin: auto;
  background:url(/ja/jp/hawaii24/lounge/img/bg_leaf_001.png) no-repeat 0 0;
  background-size:contain;
}

.mainAreaInner .column2Box .column2Item.bgDetail02{z-index: 0;}

/*-----------------------------------
mainArea.infoArea
-----------------------------------*/
.mainArea.infoArea{
  margin-top: 0;
  padding: 80px 0;
  background: #f4f4f4;
}

.mainArea.infoArea .infoAreaInner{
  max-width: 1200px;
  width: 100%;
  margin: 0 auto;
}

.infoAreaInner .column2ItemTitle.title05{max-width: 265px; margin: auto;}

.infoAreaInner .column2Box{
  display: flex;
  display: -webkit-flex;
  flex-wrap: wrap;
  -webkit-flex-wrap: wrap;
  align-items: flex-start;
  -webkit-align-items: flex-start;
  margin-top: 40px;
}

.infoAreaInner .column2Box .column2Item{
  width: 48.3%;
  color: #333;
  text-decoration: none;
}

.infoAreaInner .column2Box .column2Item + .column2Item{margin-left: 3.4%;}

.infoAreaInner .column2Box .infoTitle{
  margin-top: 20px;
  font-size: 20px;
}

.infoAreaInner .column2Box .infoTitle + p{
  margin-top: 15px;
  line-height: 1.5;
}

.infoAreaInner .column2Box .iconArrowLeft{position: relative; padding-left: 20px;}

.infoAreaInner .column2Box .iconArrowLeft::before{
  position: absolute;
  left: 0;
  top:0;
  bottom: 0;
  margin: auto;
  width: 8px;
  height: 8px;
  content: "";
  border-top: 1px solid #333;
  border-right: 1px solid #333;
  -webkit-transform: rotate(45deg);
  transform: rotate(45deg);
}

/*-----------------------------------
footerBlock
-----------------------------------*/
#footer{text-align: center;}
#footer .res-wrap-inner{max-width: 1200px; width: 100%;}
#footer .copyright{float: none;}

.footerBlock .footerInner{
  position: relative;
  max-width: 1200px;
  margin: 0 auto;
  padding: 46px 0 41px;
}

.footerBlock .pageTopBtn{
  position: absolute;
  right: 0;
  bottom: 50px;
  margin: auto;
  cursor: pointer;
}

.footerBlock .pageTopBtn .pagetop{
  display: inline-block;
  padding-left: 15px;
  background: url(/ja/jp/hawaii24/lounge/img/pagetop.png) no-repeat 0 3px;
  color: #33336a;
  font-size: 14px;
}

.footerBlock .copyRight{
  float: none;
  padding: 12px 0;
  background: #33336a;
  color: #fff;
  text-align: center;
}

/*----------------------------------------
general
----------------------------------------*/
.txtC{text-align: center;}
.super{vertical-align: top; font-size: 10px;}
.hoverEffect:hover{opacity: 0.7; transition: .2s;}
.rwdImg{max-width: 100%;height: auto;}
.pcOnly{display: block;}
.spOnly{display: none;}

/*----------------------------------------
571px ~ 1200px Only Layout
----------------------------------------*/
@media screen and (min-width:571px) and (max-width:1200px){
  .mainArea{padding: 0 15px;}
  .mainArea.infoArea{padding: 80px 15px;}
  .footerBlock .footerInner{padding-right:15px; padding-left:15px;}
  .footerBlock .pageTopBtn{right: 15px;}
}

/*----------------------------------------
SP Only Layout
-----------------------------------------*/
@media screen and (max-width:570px){

  .sectionBlock + .sectionBlock{margin-top: 50px;}

  .mainVisual .mvInner{top:6%; padding: 0 15px;}
  .mainVisual .mvInner .logo{width: 150px;}

  .headerBlock .mainTitle{position: static; width: 100%;}
  .headerBlock .mvReadBox{padding: 40px 15px 50px; background: url(/ja/jp/hawaii24/lounge/img/bg_hawaii_001_sp.jpg) no-repeat left bottom; background-size: 100% auto;}
  .headerBlock .mvReadBox .mvReadBoxTitle{width: 75%; margin: 0;}
  .headerBlock .mvReadBox .mvReadBoxTitle span::after{width: 30%; top:20%;}
  .headerBlock .mvReadBox p{line-height: 1.5;}
  .headerBlock .mvReadBox .mvReadBoxSubTitle{font-size: 18px; text-align: left;}
  .headerBlock .mvReadBox .mvReadBoxSubTitle + p{margin-top: 10px; text-align: left;}

  .mainArea{margin: 40px 0 0 0;}
  .mainArea .mainAreaInner{padding: 0 15px 50px;}
  .mainAreaInner .column2Box .column2Item{width: 100%; margin-left: 0;}
  .mainAreaInner .column2ItemTitle{margin: 0 auto 26px}
  .mainAreaInner .column2ItemTitle.title01{width: 153px; margin-top: 0;}
  .mainAreaInner .column2ItemTitle.title02{width: 278px;}
  .mainAreaInner .column2ItemTitle.title03{width: 190px; margin-top: 50px;}
  .mainAreaInner .column2ItemTitle.title04{width: 148px; margin-top: 0;}
  .mainAreaInner .column2ItemTitle + p{padding: 0; margin-bottom: 20px; line-height: 1.5; text-align: left;}
  .mainAreaInner .column2Box + .column2Box{margin-top: 50px;}
  .mainAreaInner .targetCustomerBox{margin-top: 20px; padding: 20px;}
  .mainAreaInner .targetCustomerBox .column2Box{width: 100%;}
  .mainAreaInner .targetCustomerTxtItem{padding: 8px;}
  .mainAreaInner .targetCustomerBox .column2Box:nth-child(2), .mainAreaInner .targetCustomerBox .column2Box:first-child{margin-left: 0;}
  .mainAreaInner .targetCustomerBox .targetCustomerTitle{font-size: 16px; margin-bottom: 16px;}
  .mainAreaInner .targetCustomerBox .column2Box + .column2Box{margin-top: 20px;}
  .mainAreaInner p + .column2Box{margin-top: 0;}
  .mainAreaInner p + .column2Box > .column2Item + .column2Item{margin-top: 20px;}
  .mainAreaInner .targetCustomerBox p{font-size: 12px;}
  .mainAreaInner .targetCustomerBox + .column2Box{margin-top: 70px;}
  .mainAreaInner .overviewList dd + dt{margin-top: 15px; line-height: 1.5;}
  .mainAreaInner .targetCustomerBox .targetCustomerBoxInner + .targetCustomerBoxInner{margin-top: 20px;}

  .mainArea.infoArea{padding: 40px 0;}
  .mainArea.infoArea .infoAreaInner{padding: 0 15px;}
  .infoAreaInner .column2ItemTitle.title05{width: 196px;}
  .infoAreaInner .column2Box{margin-top: 30px;}
  .infoAreaInner .column2Box .column2Item{width: 100%;}
  .infoAreaInner .column2Box .column2Item + .column2Item{margin:30px 0 0 0;}
  .infoAreaInner .column2Box .infoTitle{margin-top: 10px;}
  .infoAreaInner .column2Box .infoTitle + p{margin-top: 10px;}

  .footerBlock .footerInner{position: relative; padding: 28px 15px 30px 15px;}
  .footerBlock .footerLogo{width: 47%;}
  .footerBlock .pageTopBtn{bottom: 32px; right: 15px;}

  .bgDetail01::after{width: 29%; top:-50px; right: 15px; transform: rotate(30deg);}
  .bgDetail01::before{width: 32%; top:-20px; left: -10px; transform: rotate(-15deg)}
  .bgDetail02::after{width: 29%; top:-35px; right: 15px; transform: rotate(30deg); background: url(/ja/jp/hawaii24/lounge/img/bg_flower_001.png) no-repeat right top; background-size: contain;}
  .bgDetail02::before{width: 29%; left: -10px; transform: rotate(-15deg); background: url(/ja/jp/hawaii24/lounge/img/bg_leaf_001.png) no-repeat 0 0; background-size: contain;}
  .bgDetail03::after{width: 29%; top:-124px; right: 15px; transform: rotate(30deg); }
  .bgDetail03::before{width: 32%; top:-184px; left: -20px; transform: rotate(-10deg);background: url(/ja/jp/hawaii24/lounge/img/bg_leaf_001.png) no-repeat 0 0; background-size: contain;}
  .bgDetail04::after{width: 29%; top:-57px; right: 15px; transform: rotate(30deg);}
  .bgDetail04::before{width: 32%; top:-20px; left: -10px; transform: rotate(-15deg);}

  .spIcon01{width: 46px; height: auto;}
  .spIcon02{width: 70px; height: auto;}

  /*----------------------------------------
    general
    ----------------------------------------*/
  .pcOnly{display: none;}
  .spOnly{display: block;}
}


/*----------------------------------------
  2018/06/06追加
  ----------------------------------------*/
.boardingBox {margin-top: 90px;}
.boardingBox .bluTxt {
  font-size: 24px;
  color: #0173d3;
  line-height: 1.5
}
.boardingBox .imgArea {
  margin-top: 28px;
  text-align: center;
}
.boardingBox .imgArea .img {
  display: inline-block;
}
.boardingBox .imgArea .img img {
  width: 100%;
}
.boardingBox .imgArea .img .imgTxt {
  display: block;
  margin-top: 10px;
  font-size: 13px;
}

.overviewList {
  max-width: 820px;
  margin: 0 auto;
}
.overviewList li {
  padding: 9px 0;
  border-bottom: 1px solid #ddd;
}
.overviewList dl {
  display: table;
  table-layout: fixed;
  width: 100%;

}
.overviewList dt {
  display: table-cell;
  width: 8em;
}
.overviewList dd {
  display: table-cell;
}

.bgDetail04 .imgArea {
  margin-top: 40px;
}
.bgDetail04 .cautionTxt {
  font-size: 13px;
  line-height: 1.3;
}

.bgDetail04:before {
  top: 19%;
  left: auto;
  right: 3%;
  transform: rotate(-77deg);
}
.bgDetail04:after {
  transform: rotate(45deg);
  right: auto;
  left: 0;
}

@media screen and (max-width: 820px) {
  .overviewList {
    min-width: auto;
    width: 100%;
  }
  .bgDetail04:before {
    width: 18%;
    top: 31%;
    right: -56px;
  }
  .bgDetail04:after {
    width: 18%;
    left: -50px;
  }
}
@media screen and (max-width: 570px) {

  .boardingBox {margin-top: 40px;}

  .boardingBox .bluTxt {
    font-size: 18px;
  }
  .boardingBox .imgArea {
    margin-top: 13px;
  }
  .boardingBox .imgArea .img .imgTxt {
    margin-top: 9px;
    font-size: 12px;
  }

  .overviewList li {
    padding: 10px 0 2px;
  }
  .overviewList dl {
    display: block;
  }
  .overviewList dt {
    display: block;
    width: 100%;
  }
  .overviewList dd {
    display: block;
  }
  .bgDetail04 .imgArea {
    margin-top: 20px;
  }
  .bgDetail04 .cautionTxt {
    margin-top: 20px;
    font-size: 12px;
  }
  .bgDetail04:before {
    width: 32%;
    top: -20px;
    right: auto;
    left: -10px;
    transform: rotate(-15deg);
  }
  .bgDetail04:after {
    width: 29%;
    top: -57px;
    left: auto;
    right: 15px;
    transform: rotate(30deg);
  }
}