@charset "utf-8";

/* ===================================================================
CSS information
=================================================================== */

html,body{
  padding:0;
  margin:0;
  color:#505050;
  font-family: "ヒラギノ角ゴ Pro W3","Hiragino Kaku Gothic Pro","メイリオ",Meiryo,"ＭＳ Ｐゴシック",sans-serif;
}
ul{padding:0; margin:0;}
ul:after{ content:""; display:block; clear:both;}
li{padding:0; margin:0; list-style:none;}
.fl{ float:left;}
.fr{ float:right;}
.pc{ display:block;}
.sp{ display:none;}
input,textarea{
  background:#f7f7f7;
  border:1px solid #ccc;
}
.pt0 { padding-top:0 !important;}
.pb0 { padding-bottom:0 !important;}
.pb5 { padding-bottom:5px !important;}
.pb10{ padding-bottom:10px;}
.mt50{ margin-top:50px !important;}
@media screen and (max-width:480px){
  .mt50{ margin-top:0px !important;}

  .pc{ display:none !important;}
  .sp{ display:block;}
}


/*=======================

  FONT 関連

  =======================*/

  h1{ font-size:24px; padding:0; margin:0; font-weight:normal;}

  h2{ background:url(../../../../assets/mgcms/img/h2_icon_blue.png) no-repeat left top 3px;
   padding:0 0 0 25px;
   margin:50px 0 0 0;
   color:#237bc5;
   font-size:18px;
   font-weight:normal;
   position:relative;
 }
 /*green版*/
 .green h2{ background:url(../../../../assets/mgcms/img/h2_icon_green.png) no-repeat left top 3px;
   padding:0 0 0 25px;
   margin:50px 0 0 0;
   color:#558d13;
   font-size:18px;
   font-weight:normal;
   position:relative;
 }
 /*ブラウン版*/
 .brown h2{ background:url(../../../../assets/mgcms/img/h2_icon_brown.png) no-repeat left top 3px;
   padding:0 0 0 25px;
   margin:50px 0 0 0;
   color:#7b5e36;
   font-size:18px;
   font-weight:normal;
   position:relative;
 }
 /*hq版*/
 .hq h2{ background:url(../../../../assets/mgcms/img/h2_icon_hq.png) no-repeat left top 3px;
   padding:0 0 0 25px;
   margin:50px 0 0 0;
   color:#ffffff;
   font-size:18px;
   font-weight:normal;
   position:relative;
 }
 /*hq2 版*/
 .hq2 h2{ background:url(../../../../assets/mgcms/img/h2_icon_hq2.png) no-repeat left top 3px;
   padding:0 0 0 25px;
   margin:50px 0 0 0;
   color:#ffffff;
   font-size:18px;
   font-weight:normal;
   position:relative;
 }

 p { font-size:14px; line-height:24px; padding:0; margin:0; font-weight:normal;}
 p.coution{ font-size:10px; color:#999; font-weight:normal; line-height:16px; margin-top:6px;}
 .brown p.coution{ color:#806732;}

 @media screen and (max-width:480px){
   p{padding:5px 0 0;}
   h1{ font-size:20px; width:100%; }
   h2{ margin:0;}
   @media screen and (-webkit-min-device-pixel-ratio:0){
    h2{background:url(../../../../assets/mgcms/img/h2_icon_blue.png) no-repeat left center;}
  }
}


/*=======================

  カテゴリ・項目

  =======================*/
  /*各カテゴリ*/
  .category{ width:100%; padding:0; margin:0;}
  /*各項目を入れるbox*/
  .inner{ width:960px; margin:auto; position:relative;}
  @media screen and (max-width:480px){
   .inner{ width:auto; padding:20px;}
   .question{ padding:0px 20px; }
 }


/*=======================

  header

  =======================*/
  header{ width:100%; padding:10px 0; margin:0;}
  /*header li.fl img, header li.fr img {height:27px;}*/
  @media screen and (max-width:480px){
   header{ padding:0;}
   header .inner{ width:auto; padding:10px;}

 }


/*=======================

 imgbox共通ヘッダー画像

 =======================*/
 .imgbox{ width:100%; padding:0; margin:0;}
 .imgbox .inner{ width:960px; padding:0; margin:auto;}
 .imgbox .inner img.pc{ width:100%; }
 @media screen and (max-width:480px){
   .imgbox .inner{ width:100%; padding:0; margin:0;}
   .imgbox img{ width:100%;}
 }


 /*04 lead 応募要項テキスト*/
 .lead{
   padding:25px 30px 25px;
   margin:0;
 }
 @media screen and (max-width:480px){
   .lead{ padding:0; font-size:12px; line-height:18px;}
 }


/*=========================================

　カラーバリエーション（ハイグレード版有)
　+柄パターン
==========================================*/

/*各色背景・白文字*/
body.blue  { background-color:#082861; color:#fff;}
body.l_blue{ background-color:#e7f2f7; }
body.green { background-color:#fff; }
body.brown { background-color:#fff; }
body.hq    { background:
  url(../../../../assets/mgcms/img/bg_light.png) repeat-x top fixed,
  url(../../../../assets/mgcms/img/bg_hq1.png) no-repeat top left fixed,
  url(../../../../assets/mgcms/img/bg_hq2.png) no-repeat bottom right fixed #11284b; color:#fff; }
  body.hq2   { background:
    url(../../../../assets/mgcms/img/bg_light.png) repeat-x top fixed,
    url(../../../../assets/mgcms/img/bg_hq2_1.png) no-repeat top left fixed,
    url(../../../../assets/mgcms/img/bg_hq2_2.png) no-repeat bottom right fixed #423e3a; color:#fff; }

    @media screen and (max-width:480px){
     body.hq{
      background:
      url(../../../../assets/mgcms/img/bg_light.png) repeat-x top fixed,
      url(../../../../assets/mgcms/img/bg_hq2.png) no-repeat bottom right fixed #11284b; color:#fff;
    }
    body.hq2{
      background:
      url(../../../../assets/mgcms/img/bg_light.png) repeat-x top fixed,
      url(../../../../assets/mgcms/img/bg_hq2_2.png) no-repeat bottom right fixed #11284b; color:#fff;
    }
  }

/*カラー背景時、入力フィールドを背景白に変更
.green input,
.green textarea,
.green select{ background:#fff !important;}
.brown input,
.brown textarea,
.brown select{ background:#fff !important;}
*/

/*柄パターン*/
.pt1{ background:url(../../../../assets/mgcms/img/bg_pattern1.png); }
.pt2{ background:url(../../../../assets/mgcms/img/bg_pattern2.png); }
.pt3{ background:url(../../../../assets/mgcms/img/bg_pattern3.png); }
.pt4{ background:url(../../../../assets/mgcms/img/bg_pattern4.png); }
.pt5{ background:url(../../../../assets/mgcms/img/bg_pattern5.png); }
.pt6{ background:url(../../../../assets/mgcms/img/bg_pattern6.png); }
.pt7{ background:url(../../../../assets/mgcms/img/bg_pattern7.png); }
.pt8{ background:url(../../../../assets/mgcms/img/bg_pattern8.png); }

/*ハイグレード版*/
.high_grade h2{ color:#fff;}
.high_grade .conf-catalog-area{ background:#fff; color:#3d3d3d; padding:10px 0 30px 0;}
.high_grade .conf-catalog-area h2{ color:#3d3d3d; margin:0;}
.high_grade .conf-catalog-area .around{ color:#3d3d3d;}
.high_grade .catalog{ background:#fff; color:#3d3d3d; padding:10px 0 30px 0;}
.high_grade .catalog h2{ color:#3d3d3d; margin:0;}
.high_grade .catalog .around{ color:#3d3d3d;}
.high_grade #ttl_area{ background:#fff; padding:40px 0; color:#3d3d3d;}
.high_grade .box{ border-bottom:1px solid #727273;}
.high_grade .subttl .ttl{ display:none;}
.high_grade .subttl p{ padding-left:0 !important;}

/*　ハイグレード版　フォーム必須・OK・任意*/
.high_grade .hissu { background:url(../../../../assets/mgcms/img/icon_high_hissu.png) no-repeat left 10px; padding-left:50px;}
.high_grade .ok    {/* background:url(../../../../assets/mgcms/img/icon_high_ok.png) no-repeat left 10px; padding-left:50px;*/}
.high_grade .hisok { background:url(../../../../assets/mgcms/img/icon_high_ok.png) no-repeat left 10px; padding-left:50px;}
.high_grade .ninni { background:url(../../../../assets/mgcms/img/icon_high_ninni.png) no-repeat left 10px; padding-left:50px;}

.high_grade h2{ background:url(../../../../assets/mgcms/img/h2_icon_gray.png) no-repeat left top 3px;
  padding:0 0 0 25px;
  margin:50px 0 0 0;
  font-size:18px;
  font-weight:normal;
  position:relative;
}

/*=======================

    パンくず

    =======================*/
    /*flex box形式*/
    #ttl_area .inner      { display:flex; flex-wrap: wrap; justify-content: space-between;}
    #ttl_area .inner h1     { flex-grow:0;}
    /*hq版*/
    .hq #ttl_area .inner h1 { text-shadow:2px 2px 5px #423922; flex-grow:0;}
    /*hq2 版*/
    .hq2 #ttl_area .inner h1  { text-shadow:2px 2px 5px #423922; flex-grow:0;}


    #ttl_area .inner ul.pan   { flex-grow:0;}
    #ttl_area .inner ul.subttl  { flex-grow:1;width:80%;}
    @media screen and (max-width:480px){
     #ttl_area .inner ul.pan  { flex-grow:1; }
   }

   #ttl_area ul.subttl{margin-top:20px;}
   #ttl_area li.ttl{ background:#3d89c9; padding:7px 0; text-align:center; margin:0; color:#fff; width:16%; }
   /*グリーン背景版*/
   .green #ttl_area li.ttl{ background:#7cb933; padding:7px 0; text-align:center; margin:0; color:#fff; width:16%; }
   /*ブラウン背景版*/
   .brown #ttl_area li.ttl{ background:#856c48; padding:7px 0; text-align:center; margin:0; color:#fff; width:16%; }
   /*hq 背景版*/
   .hq #ttl_area li.ttl{ background:none; border:1px solid #fff; padding:7px 0; text-align:center; margin:0; color:#fff; width:16%; }
   /*hq2 背景版*/
   .hq2 #ttl_area li.ttl{ background:none; border:1px solid #fff; padding:7px 0; text-align:center; margin:0; color:#fff; width:16%; }
   #ttl_area li.subttl_txt{ width:80%; }
   @media screen and (max-width:480px){
    #ttl_area li.subttl_txt {
      width: auto;
    }
    #ttl_area li.subttl_txt br{
      display: block;
    }
  }

  #ttl_area li{float:left;}
  #ttl_area li p{ padding:2px 0 2px 20px; margin:0; line-height:18px;}
  ul.pan{  padding-top:0px;}
  .pan span{ display:inline-block;}
  .pan li:first-child{ background:url(../../../../assets/mgcms/img_def/pan_dott.png) -25% top no-repeat}
  .pan li:last-child{ background:url(../../../../assets/mgcms/img_def/pan_dott.png) 125% top no-repeat}
  .pan li{
   float:left;
   width:80px;
   text-align:center;
   font-size:12px;
   background:url(../../../../assets/mgcms/img_def/pan_dott.png) center top no-repeat
 }
 .pan li p{
   background:url(../../../../assets/mgcms/img_def/pan_icon.png) center top no-repeat;
   padding:20px 0 0 0 !important;
   line-height:14px;
   font-size:12px;
 }
 .pan li.active p{
   background:url(../../../../assets/mgcms/img_def/pan_icon_active.png) center top no-repeat;
   color:#237bc5;
 }

 /*ブルー背景版*/
 .blue .pan li.active p{
   background:url(../../../../assets/mgcms/img_def/pan_icon_active_blue.png) center top no-repeat;
   color:#307df1;
 }
 /*グリーン背景版*/
 .green .pan li.active p{
   background:url(../../../../assets/mgcms/img_def/pan_icon_active_green.png) center top no-repeat;
   color:#22892c;
 }
 /*hq背景版*/
 .hq .pan li.active p{
   background:url(../../../../assets/mgcms/img_def/pan_icon_active_red.png) center top no-repeat;
   color:#76b1d3;
 }
 /*hq2 背景版*/
 .hq2 .pan li.active p{
   background:url(../../../../assets/mgcms/img_def/pan_icon_active_red2.png) center top no-repeat;
   color:#d3ccbf;
 }
 .hq2 .pan li p{
   color:#7a746e;
 }

 /*ブラウン背景版*/
 .brown .pan li p{
  background:url(../../../../assets/mgcms/img_def/pan_icon2.png) center top no-repeat;
  padding:20px 0 0 0 !important;
  line-height:14px;
  font-size:12px;
  color:#a7864d;
}
.brown .pan li.active p{
  background:url(../../../../assets/mgcms/img_def/pan_icon_active_brown.png) center top no-repeat;
  color:#a7864d;
}

@media screen and (max-width:480px){
  #ttl_area li.ttl{ display:none; width:auto;}
  #ttl_area li p{ padding:2px 0;}
  #ttl_area li p br{display:none;}
  .pan{ position:inherit; margin-top:30px;}
  .pan li{ width:24%;}
}


/* #contact */
#contact .box li span{ font-size:10px;}
#contact textarea{ width:500px; height:90px;}
.input-textarea-area textarea{ width:500px; min-height:90px;}
@media screen and (max-width:480px){
  #contact .box ul{ padding:0;}
  #contact .box li br{display:none;}
  #contact .box li textarea{ width:96%; height:100px;}
}

/*06 お問い合わせ項目*/
.box{ border-bottom:1px #ccc dashed; padding:20px 0;}
/*.alert{background-color:#FFCCCC !important}*/
.box ul{ padding:0 0 0 60px; margin:0;}
.box li{ padding:0; margin:0; float:left;}
.box li:nth-child(odd){ width:30%; clear:both;}
.box li:nth-child(even){ width:70%;}
.box li:nth-child(odd) p{ padding:9px 9px 0 0 ; font-weight:bold;}
.brown .box{ border-bottom:1px #ccc dashed; padding:20px 0;}
table{ border-spacing:0;}
.box li table th{ width:40px; font-size:14px; font-weight:normal;}
.box li table td{ width:220px;}

#kakunin .box li:nth-child(odd) p{ padding-top:0px;}

@media screen and (max-width:480px){
  .box li{ float:none;}
  .box li:nth-child(odd){ width:auto;}
  .box li:nth-child(even){ width:auto;}
  .box li table th{ width:50px; font-size:12px;}
  .box li table td{ width:220px;}

  #kakunin .box ul{ padding:0 0 0 20px; margin:0;}
}


/* フォーム */
.box li { font-weight:bold; }
.box li span{ font-weight:normal; font-size:10px;}
.box li span.sub{ color:#999;line-height: 10px;}
.box input{ height:30px; padding: 3px 8px 3px 8px; font-size:14px; width:180px;}
.input-textbox-area .box input{width:488px;}
@media screen and (max-width:480px){
  .box input{ width:70%;}
  .input-textbox-area .box input{ width:90% !important;}
  .box textarea { width:90%; height:80px; }
}


/*ラヂオボタン*/
.radio { font-size:14px; font-weight:normal; padding-top:5px !important;}
.radio input{ width:25px; height:auto;}
.radio label{ padding-right: 20px; font-weight:normal; cursor:pointer;}
.radio input[type=radio], .radio input[type=checkbox]{ cursor: pointer;}

/*フォーム必須・OK・任意*/
.hissu { background:url(../../../../assets/mgcms/img/icon_hissu.png) no-repeat left 10px;}
.hisok { background:url(../../../../assets/mgcms/img/icon_ok.png) no-repeat left 10px; }
.ok    {/* background:url(../../../../assets/mgcms/img/icon_ok.png) no-repeat left 10px; */}
.ninni { background:url(../../../../assets/mgcms/img/icon_ninni.png) no-repeat left 10px; }
/*グリーン版フォームicon*/
.green .hissu { background:url(../../../../assets/mgcms/img/reform_icon_hissu.png) no-repeat left 10px; }
.green .ok    {/* background:url(../../../../assets/mgcms/img/reform_icon_ok.png) no-repeat left 10px; */}
.green .hisok    { background:url(../../../../assets/mgcms/img/reform_icon_ok.png) no-repeat left 10px; }
.green .ninni { background:url(../../../../assets/mgcms/img/reform_icon_ninni.png) no-repeat left 10px; }
/*ブラウン版フォームicon*/
.brown .hissu { background:url(../../../../assets/mgcms/img/brown_icon_hissu.png) no-repeat left 10px; }
.brown .ok    {/* background:url(../../../../assets/mgcms/img/brown_icon_ok.png) no-repeat left 10px; */}
.brown .hisok    { background:url(../../../../assets/mgcms/img/brown_icon_ok.png) no-repeat left 10px; }
.brown .ninni { background:url(../../../../assets/mgcms/img/brown_icon_ninni.png) no-repeat left 10px; }
/*hq版フォームicon*/
.hq .hissu { background:url(../../../../assets/mgcms/img/hq_icon_hissu.png) no-repeat left 10px; }
.hq .ok    {/* background:url(../../../../assets/mgcms/img/hq_icon_ok.png) no-repeat left 10px; */}
.hq .hisok    { background:url(../../../../assets/mgcms/img/hq_icon_ok.png) no-repeat left 10px; }
.hq .ninni { background:url(../../../../assets/mgcms/img/hq_icon_ninni.png) no-repeat left 10px; }
/*hq2版フォームicon*/
.hq2 .hissu { background:url(../../../../assets/mgcms/img/hq2_icon_hissu.png) no-repeat left 10px; }
.hq2 .ok    {/* background:url(../../../../assets/mgcms/img/hq2_icon_ok.png) no-repeat left 10px; */}
.hq2 .hisok    { background:url(../../../../assets/mgcms/img/hq2_icon_ok.png) no-repeat left 10px; }
.hq2 .ninni { background:url(../../../../assets/mgcms/img/hq2_icon_ninni.png) no-repeat left 10px;}


/* 住所 */
#address li:nth-child(odd){ width:12%;}
#address li:nth-child(even){ width:88%;}
#address ul.inn{ padding:0 0 0 0px; margin:0;}
#address ul.inn li{ float:left; margin-bottom:10px;}
#address ul.inn li:nth-child(odd){ width:14%; font-size:14px; font-weight:normal; text-align:left; padding:14px 0 10px 7%; line-height:14px;}
#address ul.inn li:nth-child(even){ width:79%;}
#address ul.inn li:nth-child(even) input{ width:488px;}
/*自動入力*/
#address ul.inn .post th{ width:25px; font-size:13px; text-align:center;}
#address ul.inn .post td{ width:90px;}
#address ul.inn .post td.btn { width:auto;}
#address ul.inn .post td.btn a{ display:block; padding:6px 5px; background:#c1c1c1; text-decoration:none; color:#000; margin-left:20px;}
#address ul.inn .post td.btn button{ display:block; padding:6px 5px; background:#c1c1c1; text-decoration:none; color:#000; margin-left:20px; cursor:pointer; border:none;}
#address ul.inn .post td.btn p{ width:170px; padding:0px; text-align:center; font-weight:normal; font-size:12px; background:url(../../../../assets/mgcms/img/icon_cursor.png) no-repeat left 6px center; position:relative;}
#address ul.inn .post td.btn span{ font-size:12px;}
#address ul.inn .post td input{ width:65%;}
/*ブラウン版*/
.brown #address ul.inn .post td.btn a{ display:block; padding:6px 5px; background:#856c48; color:#f9f8f5; text-decoration:none; margin-left:20px;}

/*TEL*/
#tel th{ width:13px; font-size:13px; text-align:center;}
#tel td{ width:80px;}
#tel td input {width:75px;}
/*任意*/
#address li.ninni{ position:relative;}
#address li.ninni img{ display:none;}
@media screen and (max-width:480px){
  #address li.ninni{ background:none;}
  #address li.ninni img{ position:absolute; left:-60px; top:6px; display:block;}
}

/*mail*/
#mail input,
#mail_confirm input{ width:488px;}
#mail_confirm{ margin-top:20px;}

@media screen and (max-width:480px){
  #address ul.inn .post td{ width:40px;}
  #address ul.inn .post td input{ width:40px !important;}
  #address ul.inn .post td.btn{ padding-left:10px;}
  #address ul.inn .post td.btn p{ width:80px;}
  #address ul.inn .post td.btn span{ display:none;}
  #address ul.inn .post td.btn a{ margin-left:0px;}

  #address li:nth-child(odd),#address li:nth-child(even){ width:auto;}
  #address ul.inn li:nth-child(odd){ padding:10px 0 0px 7%;}

  #address ul.inn li{ float:none;}
  #address ul.inn li br{ display:none;}
  #address ul.inn li:nth-child(odd){ width:auto; padding-left:0; font-weight:bold;}
  #address ul.inn li:nth-child(even){ width:auto;}

  #address ul.inn li:nth-child(even) input{ width:90%;}

  #tel li,#tel table{ width:100%;}
  #tel th{ width:7%;}
  #tel td{ width:25%;}
  #tel td input {width:66%;}

  #mail input,
  #mail_confirm input{ width:90%;}
}


/*=======================

  submitボタン

  =======================*/

  .submit_btn {
   padding:0;
   margin:50px auto;
   text-align:center;
   width:350px;
   background-color:#106ab6;
   color:#fff;
   -webkit-transition-duration: 0.3s;
   transition-duration: 0.3s;
   -webkit-transition-property: color, background-color;
   transition-property: color, background-color;
 }
 /*グリーン版*/
 .green .submit_btn{  background:#589c07; }
 .green .submit_btn:hover{ opacity:0.8; background:#7db610;}
 /*ブラウン版*/
 .brown .submit_btn{  background:#634d2d; }
 .brown .submit_btn:hover{ opacity:0.8; background:#8a6e45;}
 /*hq版*/
 .hq .submit_btn{ background:#ac925a; }
 .hq .submit_btn:hover{ opacity:0.9; background:#90763f;}
 /*hq2版*/
 .hq2 .submit_btn{  background:#241e19; }
 .hq2 .submit_btn:hover{ opacity:0.9; background:#595048;}



 .submit_btn:hover, .submit_btn:focus, .submit_btn:active {
   background-color: #74bfff;
   color: white;
 }
 .submit_btn a{
   color:#fff;
   text-decoration:none;
   display:block;
   padding:10px 0;
 }
 .submit_btn button{
   color:#fff;
   text-decoration:none;
   display:block;
   padding:10px 0;
   background-color: transparent;
   width:100%;
   cursor: pointer;
   border: none;
 }
 .submit_btn p{ background:url(../../../../assets/mgcms/img/icon_cursor2.png) no-repeat left 60px top 7px; position:relative;}
 @media screen and (max-width:480px){
   .submit_btn{ margin:0 auto; width:90%;}
   .submit_btn p{ background:url(../../../../assets/mgcms/img/icon_cursor2.png) no-repeat left 30px top 12px;}
 }




/*=======================

  SELECTプルダウン

  =======================*/
  .w_s{ width:240px;}
  .w_l{ width:500px;}
  .cp_ipselect {
   overflow: hidden;
   text-align: center;
 }
 .cp_ipselect select {
   width: 100%;
   padding-right: 1em;
   cursor: pointer;
   text-indent: 0.01px;
   text-overflow: ellipsis;
   border: none;
   outline: none;
   background: transparent;
   background-image: none;
   box-shadow: none;
   -webkit-appearance: none;
   appearance: none;
 }
 .cp_ipselect select::-ms-expand {
  display: none;
}
.cp_ipselect.cp_sl01 {
  position: relative;
  border: 1px solid #ccc;
  border-radius: 2px;
  background: #ffffff;
}
.cp_ipselect.cp_sl01::before {
  position: absolute;
  top: 1em;
  right: 0.9em;
  width: 0;
  height: 0;
  padding: 0;
  content: '';
  border-left: 6px solid transparent;
  border-right: 6px solid transparent;
  border-top: 6px solid #666666;
  pointer-events: none;
}
.cp_ipselect.cp_sl01 select {
  padding: 10px 38px 10px 20px;
  color: #666666;
  background-color:#f7f7f7;
  font-size:13px;
}

/*=======================

  アンケート #enq

  =======================*/
  #enq .box input{ width:20px; height:inherit;}
  #enq .box li table { margin-top:15px;}
  #enq .box li table th{ width:70px; font-size:14px; font-weight:normal;}
  #enq .box li table td{ width:180px; height:30px; padding: 3px 10px 3px 15px;}
  #enq .box li table td input{ width:72%;}
  #enq .box .buildPlanKind p{ padding-bottom:15px;}
  #enq .box .buildPlanKind p:hover{ color:#999;}
  .brown #enq .box .buildPlanKind p:hover{ color:#865c13;}
  #enq textarea{ width:500px; height:80px; padding: 10px 10px 10px 15px;}
  @media screen and (max-width:480px){
   #enq br{display:none;}
   #enq .box li table td{ width:180px; height:30px; padding: 3px 10px 3px 0px;}
   #enq table,#enq tr,#enq tbody,#enq th,#enq td {
     display: block;
     max-width: 100%;
   }
   #enq td{ width:94% !important;height:30px; margin-bottom:20px;}
   #enq td input{ width:94% !important; height:30px; padding: 3px 10px 3px 15px;}
   #enq .box .buildPlanKind p{ padding-bottom:10px;}
   #enq textarea{ width:90%; height:80px;}
 }

/*=======================

  カタログ請求
  （ハイグレード版有)

  =======================*/
  .conf-catalog-area .parent input{position:absolute; left:-30px; top:0; height:auto; width: 20px; padding:0;}
  .conf-catalog-area .parent label{ padding:0;}
  .conf-catalog-area .parent h3{ font-size:14px; font-weight:bold; padding:0 0 15px; margin:0;}
  .conf-catalog-area .parent p{ padding:15px 10px 0 0 !important; line-height:20px;}
  .conf-catalog-area .box ul{ padding:0 0 0 60px; margin:0 auto;}
  .conf-catalog-area .box li:nth-child(odd){ clear:inherit;}

  .conf-catalog-area .parent { display: flex; }
  /*.conf-catalog-area .child:hover { opacity:0.6;}*/

  .conf-catalog-area .around,
  .conf-catalog-area .around2 {
   justify-content: space-around;
   padding: 0px 0px 20px 0px;   /* 確認画面 カタログ行の行間 */
 }
 .conf-catalog-area .child {
   width: 280px;
   height: auto;
   position:relative;
 }
 @media screen and (max-width:480px){
   .conf-catalog-area .parent { display:block; }
   .conf-catalog-area .child {
    width:84%;
    margin:0 auto 30px;
  }
  .conf-catalog-area .child  img{ width:100%;}
  .conf-catalog-area .parent p{ padding:10px 0 0 0 !important;}
}
.high_grade .conf-catalog-area .box:nth-child(2){border-bottom: none;}

.conf-catalog-area .box ul.hissu,
.conf-catalog-area .box ul.hisok {
  height: 40px;
  padding: 0 0 20px 60px;
}
.conf-catalog-area .box ul.ok {
  display: none;
}

.catalog .parent input{position:absolute; left:-30px; top:0; height:auto; width: 20px; padding:0; cursor: pointer;}
.catalog .parent label{ padding:0; cursor:pointer;}
.catalog .parent h3{ font-size:14px; font-weight:bold; padding:0 0 15px; margin:0;}
.catalog .parent p{ padding:15px 10px 0 0 !important; line-height:20px;}
.catalog .box ul{ padding:0 0 0 60px; margin:0 auto;}
.catalog .box li:nth-child(odd){ clear:inherit;}

.catalog .parent { display: flex; }
.catalog .child:hover { opacity:0.6;}
.catalog .around,
.catalog .around2 {
  justify-content: space-around;
  padding: 0px 0px 20px 0px;    /* 入力画面 カタログ行の行間 */
}

.catalog .child {
  width: 280px;
  height: auto;
  position:relative;
}
@media screen and (min-width:481px){
  /* 3列表示用 */
  .col3 .child img {
    max-width: 280px;
  }
  /* 4列表示用 */
  .col4 .child img {
    max-width: 194px;
  }
}
@media screen and (max-width:480px){
  .catalog .parent { display:block; }
  .catalog .child {
    width:84%;
    margin:0 auto 30px;
  }
  .catalog .child  img{ width:100%;}
  .catalog .parent p{ padding:10px 0 0 0 !important;}
}
.high_grade .catalog .box:nth-child(2){border-bottom: none;}

.catalog .box ul.hissu,
.catalog .box ul.hisok {
  height: 40px;
  padding: 0 0 20px 60px;     /* カタログの必須行の行間 */
}
.catalog .box ul.ok {
  display: none;
}

/*=======================

  修正するボタン

  =======================*/
  #kakunin .shusei{
   position:absolute;
   right:0;
   top:0;
   padding:0px;
   width:110px;
   background:#8c8c8c;
   text-align:center;
   text-decoration:none;
   -webkit-transition-duration: 0.3s;
   transition-duration: 0.3s;
   -webkit-transition-property: color, background-color;
   transition-property: color, background-color;
   cursor: pointer;
   border: none;
 }
 #kakunin .shusei:hover, #kakunin .shusei:focus, #kakunin .shusei:active {
   background-color: #74bfff;
   color: white;
 }
 #kakunin .shusei:hover{ background-color:#555;}
 #kakunin .shusei p{ color:#fff; font-size:12px; padding:0 0 0 5px; margin:0; background:url(../../../../assets/mgcms/img/icon_cursor.png) no-repeat left 10px top 8px; position:relative;}
 @media screen and (max-width:480px){
   #kakunin .shusei{ width:72px; padding:0;}
   #kakunin .shusei p{ font-size:11px; padding:0 0 0 5px; margin:0; background:url(../../../../assets/mgcms/img/icon_cursor.png) no-repeat left 4px top 8px;}
 }




/*=======================

  受付完了画面（ハイグレード版有)

  =======================*/
  #thanks #ttl_area li p{ padding:10px 0 2px 20px; margin:0; line-height:18px;}
  #thanks .message{
   font-size:22px;
   line-height:42px;
   min-height: 220px;
   padding-top: 110px;
   text-align:center;
   border-top: 1px #ccc dashed;
 }
 #thanks .bnr_area{
   display: flex;
   -webkit-justify-content: center; /* Safari */
   justify-content:         center;
 }
 #thanks .bnr{
   width:286px;
   padding:0 10px;
   margin:0 15px;
 }
 #thanks .bnr:hover{ opacity:0.6;}
 #thanks .bnr a{ text-decoration:none;}
 /*hq版*/
 .hq .bnr a p{ color:#fff;}
 /*hq2 版*/
 .hq2 .bnr a p{ color:#fff;}

 #thanks .bnr img{ border-radius:6px; width:286px;}
 #thanks .bnr p{ padding:10px 0; }

 @media screen and (max-width:480px){
   #thanks .box { padding:0;}
   #thanks .message{
    font-size:18px;
    line-height:36px;
    padding-top:40px;
    min-height:200px;
  }
  #thanks .bnr_area{
    flex-direction: column;
  }
  #thanks .bnr p{ font-size:12px; line-height:18px; margin:auto; }
}

/*===== ハイグレード版 ======*/
.high_grade .message  { border-top:none !important; }
.high_grade .bnr_area a { color:#fff; }


/*=======================

  エラーテキスト

  =======================*/
  p.error{
   color:#F00;
   background:url(../../../../assets/mgcms/img/icon_error.png) no-repeat left center;
   padding-left:25px;
   margin-top:7px;
   font-weight:normal;
 }
 @media screen and (max-width:480px){
   p.error{font-size:11px;}
 }


/*=======================

  Footerエリア

  =======================*/
  footer h3{ font-size:16px; padding:0 0 5px; margin:0;}
  footer .inner{ padding-bottom:20px;}
  footer .fl{ width:82%;}
  footer .fr{ width:16%; padding:0px 0;}
  footer p{ font-size:12px; line-height:18px;}
  footer .box:after{ clear:both; content:""; display:block;}
  footer .copyright{
   padding-top:5px;
   font-size:10px;
   text-align:right;
 }
 @media screen and (max-width:480px){
   footer .copyright{ text-align:center;}
   footer .fl,footer .fr{ float:none; width:100%;}
   footer .fr{ text-align:center; padding:10px 0;}
   footer .fr table{ margin:auto;}
 }


 input::placeholder {
  color: #aaa;
}
input::-webkit-input-placeholder {
  color: #aaa;
}
input::-moz-placeholder {
  color: #aaa;
}
input:-ms-input-placeholder {
  color: #aaa;
}

/* カタログの必須行の行間 */
p.notice {font-size:12px; color:#999; font-weight:normal !important; line-height:16px; margin-top:6px;}

/* 下線非表示用 */
.noborder {border-bottom: 0px}

/*ul連続入力箇所のマージン*/
.box ul:nth-child(2).continuous li input{ margin-top:10px;}

/*liタイトル不要時のマージン・フォント(戻し)*/
li.sub_formbox {width: 70%; margin-left: 30%;}
li.sub_formbox p.coution {font-weight:normal;}

/*=======================
お客様紹介情報用
=======================*/
/* 住所 */
.address li:nth-child(odd){ width:12%;}
.address li:nth-child(even){ width:88%;}
.address ul.inn{ padding:0 0 0 0px; margin:0;}
.address ul.inn li{ float:left; margin-bottom:10px;}
.address ul.inn li:nth-child(odd){ width:14%; font-size:14px; font-weight:normal; text-align:left; padding:14px 0 10px 7%; line-height:14px;}
.address ul.inn li:nth-child(even){ width:79%;}
.address ul.inn li:nth-child(even) input{ width:488px;}
/*自動入力*/
.address ul.inn .post th{ width:25px; font-size:13px; text-align:center;}
.address ul.inn .post td{ width:90px;}
.address ul.inn .post td.btn { width:auto;}
.address ul.inn .post td.btn a{ display:block; padding:6px 5px; background:#c1c1c1; text-decoration:none; color:#000; margin-left:20px;}
.address ul.inn .post td.btn button{ display:block; padding:6px 5px; background:#c1c1c1; text-decoration:none; color:#000; margin-left:20px; cursor:pointer; border:none;}
.address ul.inn .post td.btn p{ width:170px; padding:0px; text-align:center; font-weight:normal; font-size:12px; background:url(../../../../assets/mgcms/img/icon_cursor.png) no-repeat left 6px center; position:relative;}
.address ul.inn .post td.btn span{ font-size:12px;}
.address ul.inn .post td input{ width:65%;}
/*ブラウン版*/
.brown .address ul.inn .post td.btn a{ display:block; padding:6px 5px; background:#856c48; color:#f9f8f5; text-decoration:none; margin-left:20px;}

/*TEL*/
.tel th{ width:13px !important; font-size:13px !important; text-align:center;}
.tel td{ width:80px !important;}
.tel td input {width:75px;}
/*任意*/
.address li.ninni{ position:relative;}
.address li.ninni img{ display:none;}
@media screen and (max-width:480px){
  .address li.ninni{ background:none;}
  .address li.ninni img{ position:absolute; left:-60px; top:6px; display:block;}
}

/*mail*/
.mail input,
.mail_confirm input{ width:488px;}
.mail_confirm{ margin-top:20px;}

@media screen and (max-width:480px){
  .address ul.inn .post td{ width:40px;}
  .address ul.inn .post td input{ width:40px !important;}
  .address ul.inn .post td.btn{ padding-left:10px;}
  .address ul.inn .post td.btn p{ width:80px;}
  .address ul.inn .post td.btn span{ display:none;}
  .address ul.inn .post td.btn a{ margin-left:0px;}

  .address li:nth-child(odd),.address li:nth-child(even){ width:auto;}
  .address ul.inn li:nth-child(odd){ padding:10px 0 0px 7%;}

  .address ul.inn li{ float:none;}
  .address ul.inn li br{ display:none;}
  .address ul.inn li:nth-child(odd){ width:auto; padding-left:0; font-weight:bold;}
  .address ul.inn li:nth-child(even){ width:auto;}

  .address ul.inn li:nth-child(even) input{ width:90%;}

  .tel li,.tel table{ width:100%;}
  .tel th{ width:7%;}
  .tel td{ width:25%;}
  .tel td input {width:66%;}

  .mail input,
  .mail_confirm input{ width:90%;}
}



/*=======================
  追加
  =======================*/

  input.text_other {
   height: 30px;
   padding: 3px 8px 3px 8px;
   font-size: 14px;
   width: 360px;
 }

 .ajst{
  margin: 0 0 10px 33px;  
}

.planlink{
  float: right;
  display:  inline-block;
  text-align:  right;
  font-size: small;
  margin-top: -25px;
}

.planlink a{
  padding:12px 20px;
  text-align:center;
  background-color:#000;
  color:#fff;
  -webkit-transition-duration: 0.3s;
  transition-duration: 0.3s;
  -webkit-transition-property: color, background-color;
  transition-property: color, background-color;
}
.planlink a:hover{
 opacity:0.8; 
 background:#999;
}

@media screen and (max-width:480px){

  input.text_other {
   height: 30px;
   padding: 3px 8px 3px 8px;
   font-size: 14px;
   width: 160px;
 }

 .planlink{
  display: block;
  float: none;
  text-align:  left;
  margin: 25px auto auto 30px ;
}
.planlink a{
  padding:15px 20px;
}

}


