@charset "UTF-8";

/* php対応用　既存ページにかかわる追加・修正css */

/* TOPスライド２ タイトル領域確保 */
@media screen and (min-width: 960px), print {
  .top-container .slide.two .titleOne {
    top: 150px;
  }
  .top-container .slide.two .titleTwo {
    top: 150px;
  }
}

@media screen and (min-width: 560px), print {
  .top-container .slide.two .titleOne {
    top: 180px;
  }
  .top-container .slide.two .titleTwo {
    top: 180px;
  }
}


/* ヘッダー電話番号エリア */
/* 共通 */
.phpHeaderArea{
  background-color: rgba(255,255,255,.94);
}
.headerTelArea__num::before{
  content: "";
  width: 1.8rem; 
  height: 1.8rem;
  margin-bottom: 0.2rem; 
  transform: translateY(25%);
  display: inline-block; /* インライン要素の前にアイコンを表示 */
  background-image: url("../img/phone-solid-full.svg");
}
.headerTelArea{
  font-family: Noto Serif JP;
  font-weight: bold;
}
/* PC 1300px以上*/
@media screen and (min-width: 1300px), print {
  .headerTelArea--tbSp{
    display: none;
  }
  .phpHeaderArea--pc{
    display: flex;
    position: relative;
  }
  .header-nav,
  #item-detalis .header-nav, .container-darea .header-nav, .container-faq .header-nav{
    width: 100%;
    height: 60px;
  }
  .headerTelArea{
    position: absolute;
    right: 8rem;
    top: 5rem;
    z-index: 15;
  }
  .headerTelArea__text{
    font-size:0.9rem;
    padding-left: 3.5rem;
    margin-bottom: -.8rem;
  }
  .headerTelArea__num{
    font-size: 1.8rem;
  }
}

/* PC,tb.sp 1299px以下*/
@media screen and (max-width: 1299px), print {
  .headerTelArea--pc{
    display: none;
  }
  .headerTelArea--tbSp{
    display: flex;
    text-align: center;
    justify-content: center;
    height: 35px;
  }
  .headerTelArea__text{
    font-size:1.1rem;
    margin-top: .3rem;
  }
  .headerTelArea__num{
    font-size: 1.5rem;
  }
}
/* スマホ用調整 */
@media screen and (max-width: 560px), print {
  .headerTelArea--tbSp{
    height: 25px;
  }
  .headerTelArea__text{
    font-size:.85em;
    margin-top: 0;
  }
  .headerTelArea__num{
    font-size: 1em;
  }
  .headerTelArea__num::before{
    width: 1em;
    height: 1em;
  }
}


/* ご利用の流れstep2 */

/* pc */
@media screen and (min-width: 960px), print {
  .h3_comment_img_02,
  .h3_comment_img_03{
    top:8rem;
  }
  .h3_comment--telNum{
    padding-bottom: 1rem;
  }
}

/* タブレット */
@media screen and (max-width:959px), print {
  .goriyo-area--img,
  .h3_comment_img_03{
    left: initial;
    right: 1rem;
  }
  .h3_comment_img_02{
    left: initial;
    right: 5.5rem;
    top: 7rem;
  }
}

/* スマホ */
@media screen and (max-width: 560px), print {
  .goriyo-area--img,
  .h3_comment_img_03{
    left: initial;
    right: 1rem;
  }
  .h3_comment_img_02{
    left: initial;
    right: 5rem;
    top: 7.8rem;
  }
}

/* 商品詳細注文ボタン */
#item-detalis .main-detalis .main-img .submit--phpOrderNumArea{
  display: block;
  height: 65px;
  font-family: Noto Sans JP;
}
.phpOrderNumText{
  font-size: .8rem;
}
.phpOrderNum{
  font-size: 1.8rem;
}

@media screen and (max-width:959px), print {
  #item-detalis .main-detalis .main-img .submit--phpOrderNumArea{
    height: 50px;
  }
  .phpOrderNumText{
    font-size: .6rem;
  }
  .phpOrderNum{
    font-size: 1rem;
  }
}
@media screen and (max-width:660px), print {
  #item-detalis .main-detalis .main-img .submit--phpOrderNumArea{
    height: 40px;
  }
  .phpOrderNumText{
    font-size: .5rem;
  }
  .phpOrderNum{
    font-size: 1rem;
  }
}
@media screen and (max-width:560px), print {
  #item-detalis .main-detalis .main-img .submit--phpOrderNumArea{
    height: 65px;
    margin-bottom: 2rem;
  }
  .phpOrderNumText{
    font-size: .75rem;
  }
  .phpOrderNum{
    font-size: 1.75rem;
  }
}