@charset "utf-8";

@font-face {
  font-family: "Hiragino Sans W9";
  src: local(HiraginoSans-W9);
  font-weight: 800;
}

/*------------------
    共通
------------------*/
body{
  margin:auto;
  font-family: "ヒラギノ角ゴ Pro W3","Hiragino Kaku Gothic Pro","メイリオ",Meiryo,"ＭＳ Ｐゴシック",sans-serif;
}

ul{
	margin:0;
	padding:0;
}
li{
  list-style-type: none;
}
a{text-decoration: none;}
p,dl,dd,h1,h2,h3{margin:0;}
.fadein {
  opacity : 0;
  transform: translateY(20px);
  transition: all 1s;
}
/* iOSでのデフォルトスタイルをリセット */
input[type="submit"],
input[type="button"] {
  border-radius: 0;
  -webkit-box-sizing: content-box;
  -webkit-appearance: button;
  appearance: button;
  border: none;
  box-sizing: border-box;
  cursor: pointer;
}
input[type="submit"]::-webkit-search-decoration,
input[type="button"]::-webkit-search-decoration {
  display: none;
}
input[type="submit"]::focus,
input[type="button"]::focus {
  outline-offset: -2px;
}
.footer_tel{
  color:#fff !important;
}

/* フォント */
.century{
  font-family:'Century Gothic';
}
.yu{
      font-family: "Yu Gothic Medium", "游ゴシック Medium", YuGothic, "游ゴシック体", "メイリオ";
}

/*==================
   PC
==================*/
@media screen and (min-width:769px) {
/* displaynone */
.pc_none{
  display:none !important;
}
a:hover{
  opacity:.5;
  transition:.3s;
}

/* fv */
#mv{
    background: #a12f00;
    padding: 103px 0 45px;
    position: relative;
  }
.top_fix{
    color: #fff;
    position: fixed;
    padding: 25px 0;
    background: #a12f00;
    overflow: hidden;
    width: 100%;
    top: 0;
    z-index: 100;
}
.top_fix_inner{
  width: 950px;
  margin:auto;
}
.top_logo{float: left;}
.top_logo_img{
  width: 238px;
    vertical-align: bottom;
}
.top_right_area{float: right;}
.top_btn{
    background: #ebe97a;
    color: #a12f00!important;
    font-weight: 800;
    font-family: "Hiragino Sans";
    padding: 8px 30px 8px 18px;
    margin-left: 5px;
    vertical-align: text-bottom;
    box-shadow: -2px 2px 0px 0px #aeaeae;
    position: relative;
}
.top_btn:after{
content: "";
    background: url(../images/btn_icon.png);
    background-repeat: no-repeat;
    background-size: 0.8em;
    width: 1em;
    height: 1.5em;
    display: block;
    position: absolute;
    right: 5px;
    top: 10px;
}
.fix_inner{
    display: inline-block;
}
.tel_area{
    line-height: 2.3;
}
.tel_t_txt{
  font-size: 13px;
}
.tel_icon{
  width: 50px;
    vertical-align: middle;
    margin: 0 5px;
}
.tel_no{
  width: 145px;
    vertical-align: middle;
}
.tel_b_txt{
font-size:10px;
}
.time{
    margin: 0 5px;
    width: 70px;
}
.y_btn{
    font-size: 7px;
    background: #333333;
    padding: 3px 5px;
    margin-right: 5px;
}
.mv_area{
background: #fff url(../images/fv.png);
    background-repeat: no-repeat;
    background-position: 775px 170px;
    background-size: 150px;
    width: 950px;
    margin: auto;
    padding: 30px 0 10px;
    position: relative;
    }

.day_txt{
color:#fff;
font-size: 21px;
letter-spacing: 0.08em;
background:url(../images/day_bg.png);
background-repeat: no-repeat;
background-size:100%;
    width: 300px;
    padding: 15px 0 15px 15px;
    line-height: 1.3;
}
.day_small{
font-size: 17px;
}
.day_bold{
color:#ebe97a;
font-size:21.5px;
    font-weight: 800;
    font-family: "Hiragino Sans";
}
.mv_intr{
    position: absolute;
    right: 50px;
    top: 45px;
}
.h2_img{
  width: 588px;
}

.campain{
width: 760px;
    margin: 30px 0 0 55px;
}
.campain_list{
      margin-bottom: 20px;
}
.campain_list:last-child{
margin-bottom:0;
}
.cam{
      display: inline-block;
}
.cam_tii{
    vertical-align: super;
    margin-right: 20px;
}
.cam_no{
  font-size: 36px;
    vertical-align: sub;
}
.cam_c{
font-size: 34px;
  width: 170px;
}
.price{
  width: 180px;
  text-align: right;
}
.price2{
  line-height: 1;
  vertical-align: bottom;
}
.att{
  font-size: 10px;
}
.cam_icon{
    width: 21px;
    margin-left: 10px;
}
.money{
font-size: 47px;
}
.cam_en{
font-size:25px;
}
.cam_r{
    color: #d82b0d;
    font-size: 41px;
    font-weight: 800;
    font-family: "Hiragino Sans";
}
.zero_img{
    width: 55px;
    vertical-align: sub;
    margin: 0 10px 0 5px;
}
.cam3{
  width:140px;
}
.cam3_no{
  font-size:30px;
    vertical-align: middle;
}
.att_mv{
  font-size: 11px;
  text-align: right;
  margin-top: 35px;
}


/* ファイバーアクセス */
#fiber{
    padding: 60px 0;
    background:url(../images/bg.png);
    background-repeat: no-repeat;
    background-size:100%;
  text-align: center;
}
.fiber_intr{
  font-size:23px;
}
.hikari{
text-shadow:0px 0px 5px #c53412;
color: #fff;
font-weight: bold;
font-size: 26px;
}
.logo_r{
  width: 307px;
  margin:30px 0;
}
.fiber_txt{
  font-size: 17px;
  letter-spacing: 0.1em;
    margin-bottom: 40px;
}
.point_area{

}
.point_list{
    width: 206px;
    height: 141px;
    padding: 35px 0 30px;
    display: inline-block;
    vertical-align: bottom;
    margin-right: 45px;
}
.point_list:last-child{
margin-right: 0;
}
.point_bk1{
    background: url(../images/point01.png);
    background-repeat: no-repeat;
    background-size: 100%;
}
.point_bk2{
    background: url(../images/point02.png);
    background-repeat: no-repeat;
    background-size: 100%;
}
.point_bk3{
    background: url(../images/point03.png);
    background-repeat: no-repeat;
    background-size: 100%;
}
.point_tit{
font-size: 22px;
color:#c53412;
}
.point_middle{
    font-size: 39px;
    margin: 10px 0 5px;
}
.point_btm{
font-size: 15px;
    line-height: 1.3;
}

/* 料金 */
#price_area{
background:#ededed;
padding: 25px 0;
}
.price_area_inner{
  width: 950px;
  margin:auto;
}
.price_area_tit{
    font-size: 26px;
    background: url(../images/en.png);
    background-repeat: no-repeat;
    background-size: 56px;
    background-position: top left;
    height: 80px;
    width: 890px;
    margin: auto;
    padding: 24px 0 0 60px;
    letter-spacing: 0.1em;
}
.price_area_txt{
}
.pt{
    display:inline-block;
}
.price_txt_01{
font-size: 26px;
}
.price_txt_02{

}
.plas{
    color: #fff;
    background: #a12f00;
    border-radius: 20px;
    font-size: 10px;
    padding: 4px;
    vertical-align: middle;
    margin: 0 3px;
}
.red_bold{
color:#a12f00;
    font-weight: 800;
    font-family: "Hiragino Sans";
  }
.price_list{
    border-bottom: 1px #000 dotted;
    padding: 30px 0 20px;
}
.price_list2{
    border-bottom: 1px #000 solid;
    padding: 30px 0 20px;
}
.price_icon{
width: 63px;
vertical-align: sub;
}
.pr_txt{
    font-size: 21px;
    margin: 0 15px;
}
.pr{
  display: inline-block;
}
.pr_en{
    font-size: 24px;
    text-align: center;
    line-height: 1;
}
.zei{
font-size: 8px;
}
.off{
    width: 180px;
    vertical-align: sub;
    margin: 0 10px;
}
.pr_no{
  font-size:62px;
}
.en2{
    color: #d82b0d;
    font-weight: 800;
    font-family: "Hiragino Sans";
}
.price_txt_3000{
font-size:56px;
position: relative;
}
.line{
position: absolute;
    width: 180px;
    left: 0;
    top: 30px;
}
.en_3000{
    font-size: 23px;
}
.zei_3000{
    font-size: 13px;
}
.pr_r{
  line-height: 1;
  font-size: 38px;
}
.pr_zero{
    vertical-align: super;
}
.now{
font-size:12px;
}
.table_img{
    width: 442px;
}
.table_icon{
    width: 22px;
    margin: 0 5px;
    vertical-align: super;
}
.price_area_table{
  position:relative;
}
.zero_img2{
    position: absolute;
    top: 50px;
    width: 55px;
}
.cam_sub_txt{
  font-size: 21px;
}
.pr_r2{
  margin-left: 65px;
}

/* オプション */
.option{
background: #fff;
padding: 35px;
margin:42px 0 65px;
color:#333;
}
.op_tit{
  font-size: 22px
}
.op_tit_s{
  font-size: 15px
}
.option_area{
  margin-top: 25px;
}
.option_sub_tit{
  font-size: 23px;
    display: inline-block;
    width: 143px;
    background: #897068;
    color: #fff;
    border-radius: 5px;
    text-align: center;
    padding: 77px 0;
    vertical-align: top;
}
.option_txt_area{
    display: inline-block;
    width: 670px;
    border: 1px #897068 solid;
    border-radius: 5px;
    padding: 27px 27px 15px;
}
.op_intr{
font-size: 20px;
    color: #897068;
    font-weight: bold;
    font-family: "Hiragino Sans";
    margin-bottom: 20px;
}
.op_intr_s{
  font-size: 15px;
  color:#333;
  font-weight: normal;
}
.op_txt{
  font-size: 15px;
  margin-bottom: 15px;
}
.op_att{
  font-size: 11px;
}
.op_link{
  text-decoration:underline;
  color: #a12f00;
}

/* おすすめ */
#reco{
background:#a12f00;
padding: 45px 0;
}
.reco_area{
  width:950px;
  margin:auto;
}
.reco_tit{
  color:#fff;
  font-size: 23px;
  text-align: center;
  margin-bottom: 50px;
}
.reco_logo{
  width: 260px;
    vertical-align: sub;
    margin-right: 15px;
}
.reco_main{
  width: 100%;
}

/* お申し込みの流れ */
#flow{}
.flow_area,.step{
width: 950px;
margin:auto;
}
.flow_tit{
  text-align: center;
  font-size: 26px;
  margin:80px 0 50px;
}
.step{}
.step_list{
  background:#ededed;
  border-radius: 10px;
  padding: 40px 30px;
}
.step:after{
content:"";
background:url(../images/step_icon.png);
background-repeat: no-repeat;
background-size:42px;
width: 42px;
height: 22px;
display: block;
    margin: 15px auto 15px;
}
.step:last-child:after{
content:"";
background: none;
}
.step_intr{
  text-align: center;
  font-size: 23px;
  font-weight: bold;
  color:#a12f00;
}
.flow_btn{
  text-align: center;
  font-size: 17px;
  color:#fff;
  background:#a12f00;
  display: block;
  padding: 20px 0;
  width: 441px;
  margin:30px auto;
  position: relative;
}
.flow_btn:after{
content: "\03e";
    position: absolute;
    right: 20px;
}
.flow_att{
    width: 760px;
    margin:30px auto 0;
}
.flow_att_tit1,.flow_att_tit2,.flow_att_tit3{
    font-size: 15px;
    writing-mode: vertical-rl;
    display: inline-block;
    letter-spacing: 0.1em;
}
.flow_att_tit1{
    padding: 50px 0;
}
.flow_att_tit2{
    padding: 13px 0;
}
.flow_att_tit3{
  vertical-align: bottom;
}

.flow_txt{
    font-size: 13px;
    display: inline-block;
    width: 710px;
    padding-left: 15px;
    border-left: 2px #000 solid;
}

/* フッター */
.footer_area{
    background: #000;
    color: #fff;
    padding: 25px 0;
    position: relative;
}
.footer_gin{
  font-size: 12px;
  margin-left: 200px;
}
.re_btn{
    font-size: 12px;
    background: #fff;
    border-radius: 20px;
    color: #333!important;
    padding: 5px 0px;
    display: block;
    width: 158px;
    text-align: center;
    position: absolute;
    right: 70px;
    top: 20px;
}
.re_btn_img{
width:10px;
margin-left: 10px
}
.copy{
font-size: 11px;
    text-align: right;
    margin: 15px 70px 0 0;
}

}

/*==================
	 SP
==================*/
@media screen and (max-width:768px) {

/*------------------
    共通
------------------*/
/* displaynone */
.sp_none{
  display:none !important;
}

/* 上固定 */
.sp_fix_area{
    background: #a12f00;
}
.fix_sp{
background:#a12f00;
width: 100%;
position: fixed;
z-index: 100;
    text-align: center;
}
.top_logo_sp{
    width: 150px;
    padding: 10px 0 6px;
}
.sp_mv_area{
padding: 40px 8px 10px;
}
.mv_sp{width: 100%;}

/* 下固定 */
.sp_bottom{
    background: #a12f00;
    text-align: center;
    padding: 10px 0;
    width: 100%;
    bottom: 0;
    position: fixed;
    z-index: 100;
}
.tel_sp{
    width: 200px;
    vertical-align: bottom;
}
.btn_sp{
    width: 100px;
    vertical-align: bottom;
}
/* ファイバーアクセス */
#fiber{
    padding: 40px 20px;
    background:url(../images/bg.png);
    background-repeat: no-repeat;
    background-size:100%;
  text-align: center;
}
.fiber_intr{
  font-size:20px;
}
.hikari{
text-shadow:0px 0px 5px #c53412;
color: #fff;
font-weight: bold;
font-size: 26px;
}
.logo_r{
  width: 230px;
  margin:20px 0;
}
.fiber_txt{
  letter-spacing: 0.1em;
    margin-bottom: 40px;
}
.point_area{

}
.point_list{
    width: 206px;
    height: 141px;
    padding: 35px 0 30px;
    display: inline-block;
    vertical-align: bottom;
    margin-bottom: 20px;
}
.point_list:last-child{
margin-right: 0;
}
.point_bk1{
    background: url(../images/point01.png);
    background-repeat: no-repeat;
    background-size: 100%;
}
.point_bk2{
    background: url(../images/point02.png);
    background-repeat: no-repeat;
    background-size: 100%;
}
.point_bk3{
    background: url(../images/point03.png);
    background-repeat: no-repeat;
    background-size: 100%;
}
.point_tit{
font-size: 22px;
color:#c53412;
}
.point_middle{
    font-size: 39px;
    margin: 10px 0 5px;
}
.point_btm{
font-size: 15px;
    line-height: 1.3;
}
/* 料金 */
#price_area{
background:#ededed;
padding: 25px 20px;
}
.price_area_inner{
}
.price_area_tit{
    font-size: 26px;
    background: url(../images/en.png);
    background-repeat: no-repeat;
    background-size: 56px;
    background-position: top left;
    height: 80px;
    padding: 24px 0 0 60px;
    letter-spacing: 0.1em;
}
.price_area_txt{
    text-align: center;
    padding: 30px 0 20px;
}
.pt{
    display:inline-block;
}
.price_txt_01{
font-size: 20px;
}
.price_txt_02{

}
.plas{
    color: #fff;
    background: #a12f00;
    border-radius: 20px;
    font-size: 10px;
    padding: 4px;
    vertical-align: middle;
    margin: 0 3px;
}
.red_bold{
color:#a12f00;
    font-weight: 800;
    font-family: "Hiragino Sans";
  }
.price_list{
    border-bottom: 1px #000 dotted;
    padding: 30px 0 20px;
    text-align: center;
}
.price_list2{
    border-bottom: 1px #000 solid;
    padding: 30px 0 20px;
    text-align: center;
}
.price_icon{
    width: 5em;
    vertical-align: middle;
    margin-bottom: 15px;
}
.pr_txt{
    font-size: 21px;
    margin: 0 15px;
}
.pr_sp{
  display: inline-block;
}
.pr_en{
    font-size: 24px;
    text-align: center;
    line-height: 1;
}
.zei{
font-size: 8px;
}
.off{
    width: 150px;
    vertical-align: sub;
}
.pr_no{
  font-size:40px;
}
.en2{
    color: #d82b0d;
    font-weight: 800;
    font-family: "Hiragino Sans";
}
.price_txt_3000{
font-size:40px;
position: relative;
}
.line{
    position: absolute;
    width: 150px;
    left: 0;
    top: 18px;
}
.en_3000{
    font-size: 23px;
}
.zei_3000{
    font-size: 13px;
}
.pr_r{
line-height: 1;
    font-size: 26px;
    text-align: left;
    display: inline-block;
    color: #d82b0d;
    font-weight: 800;
    font-family: "Hiragino Sans";
}
.pr_zero{
    vertical-align: super;
}
.now{
font-size:12px;
}
.table_img{
    width:100%;
}
.table_icon{
    width: 22px;
    margin: 0 5px;
    vertical-align: super;
}
.table_icon_sp{
    width: 60px;
    margin: 10px 0;
}
.price_area_table{
    padding: 0 0 20px;
    text-align: center;
}
.zero_img2{
    display: inline-block;
    width: 40px;
}
.cam_sub_txt{
    font-size: 14px;
  }
.pr_r2{
    display: inline-block;
}
.zero_img{
    display: inline-block;
    width: 40px;
    vertical-align: bottom;
    }
.cam_icon_sp{
    width: 30px;
    margin: 10px 0;
}

/* オプション */
.option{
    background: #fff;
    padding: 20px;
    margin: 20px 0 40px;
    color: #333;
}
.op_tit{
  font-size: 22px;
text-align: center;
}
.op_tit_s{
  font-size: 15px
}
.option_area{
  margin-top: 25px;
}
.option_sub_tit{
    font-size: 20px;
    background: #897068;
    color: #fff;
    border-radius: 5px;
    text-align: center;
    padding: 5px 0;
    margin-bottom: 10px;
}
.option_txt_area{
    border: 1px #897068 solid;
    border-radius: 5px;
    padding: 20px;
}
.op_intr{
font-size: 20px;
    color: #897068;
    font-weight: bold;
    font-family: "Hiragino Sans";
    margin-bottom: 20px;
    text-align: center;
}
.op_intr_s{
  font-size: 15px;
  color:#333;
  font-weight: normal;
}
.op_txt{
  margin-bottom: 15px;
}
.op_att{
  font-size: 14px;
}
.op_link{
  text-decoration:underline;
  color: #a12f00;
}

/* おすすめ */
#reco{
    background: #a12f00;
    padding: 30px 20px;
}
.reco_area{
}
.reco_tit{
  color:#fff;
  font-size: 20px;
  text-align: center;
  margin-bottom: 30px;
}
.reco_logo{
  width: 200px;
    vertical-align: sub;
    margin-right: 15px;
}
.reco_main{
  width: 100%;
}

/* お申し込みの流れ */
#flow{}
.flow_area,.step{

}
.flow_tit{
  text-align: center;
  font-size: 26px;
  margin:80px 0 50px;
}
.step{
      margin: 0 20px;
}
.step_list{
  background:#ededed;
  border-radius: 10px;
  padding: 40px 30px;
}
.step:after{
content:"";
background:url(../images/step_icon.png);
background-repeat: no-repeat;
background-size:42px;
width: 42px;
height: 22px;
display: block;
    margin: 15px auto 15px;
}
.step:last-child:after{
content:"";
background: none;
}
.step_intr{
  text-align: center;
  font-size: 20px;
  font-weight: bold;
  color:#a12f00;
}
.flow_btn{
    text-align: center;
    font-size: 17px;
    color: #fff;
    background: #a12f00;
    display: block;
    padding: 20px 0;
    width: 80%;
    margin: 30px auto;
    position: relative;
}
.flow_btn:after{
content: "\03e";
    position: absolute;
    right: 20px;
}
.flow_att{
    margin:30px auto 0;
}
.flow_att_tit1,.flow_att_tit2,.flow_att_tit3{
    border-bottom: solid #000 2px;
    margin-bottom: 20px;
    padding-bottom: 10px;
    font-size: 18px;
  }

.flow_txt{
}

/* フッター */
.footer_area{
    background: #000;
    color: #fff;
    padding: 65px 0 25px 20px;
    position: relative;
    z-index: 101;
}
.footer_gin{
  font-size: 12px;
}
.re_btn{
font-size: 12px;
    background: #fff;
    border-radius: 20px;
    color: #333;
    padding: 5px 0px;
    display: block;
    width: 158px;
    text-align: center;
    position: absolute;
    right: 20px;
    top: 20px;
}
.re_btn_img{
width:10px;
margin-left: 10px
}
.copy{
    font-size: 10px;
    margin-top: 10px;
}


}