@charset "UTF-8";
/*=======================================================================
 *
 * 全体レイアウト
 *
 *=======================================================================*/
#wrapper{
  width:100%;
  background-color:#FFF;
  height:100%;
  overflow: hidden;
}

header{
  width:100%;
  position: relative;
  display: block;
  background-color: #FFF;
  /*border:1px red solid;*/
}
#main_box{
  width:100%;
  position: relative;
}

/*--------------------------------------------------------
 * 共通メインレイアウト
 *--------------------------------------------------------*/

#main_box .main-center-box{
  float: left;
  width: 100%;
  margin-right: -262px;
  padding-right: 262px;
  box-sizing: border-box;
  /*background-color: #3498db;*/
  /*min-height:1000px*/
}
#main_box .main-center-box > section{
  padding:1em;
}
#main_box .main-left-box{
  /*background-color: #e74c3c;*/
  padding-top:1em;
  padding-left:0.5em;
  padding-right:0.5em;
  margin-right:32px;
  float: left;
  width: 230px;
}

/*----------------------------------------------
  左メニュー
 -----------------------------------------------*/

.side_menu ul li{
  border-top:1px #AAA solid;
  border-left:1px #AAA solid;
  border-right:1px #AAA solid;
}
.side_menu ul li:last-of-type{
  border-bottom:1px #AAA solid;

}
.side_menu ul li a{
  display:block;
  padding:1em;
}
.side_menu ul li .icon{
  padding:9px 0px 0px 8px;width:32px;float:left;
}
.side_menu ul li a{
  padding-left:40px;
}


/*----------------------------------------------
  その他共通
 -----------------------------------------------*/
h2 {
  font-size:180%;
  position: relative;
  display: inline-block;
  margin-bottom: 1em;
}
h2:before {
  content: '';
  position: absolute;
  bottom: -15px;
  display: inline-block;
  width: 60px;
  height: 5px;
  left: 50%;
  -webkit-transform: translateX(-50%);
  transform: translateX(-50%);
  background-color: black;
  border-radius: 2px;
}
header{
  border-bottom:1px #000 solid;
}
header .logo_box{
  float:left;
  display:block;
}
header .logo_box img{
  float:left;
}
header .logo_box h1{
  float:left;
  display:block;
  font-size: 160%;
  padding-top:0.6em;
}
header .logo_box .member_name_box{
  float:right;
  font-size: 120%;
  padding-left:2em;
  padding-top:1.2em;
}

header .toggle_box{
  display:none;
}
header .toggle_box{
  float:right;
}
header .toggle_box i{
  position:relative;
  top:3px;
  right:10px;
  cursor: pointer;
}
header .toggle_box i.close{
  display:none;
}
.section01{
  width:100%;
}
.error_msg{
  text-align:center;
  font-size: 180%;
  font-weight: 600;
  color:red;
  padding:1em;
}
.form01 .row.head .cell-col{
  background-color:#000;
}
.form01 .row.head .cell-head img{
  max-width:100%;
}
.form01 .row.head .cell-col p{
  position: relative;
  color:#FFF;
  font-size:120%;
  top:-15px;
}

.form01 .email_box{
  padding:2em;
}

.form01 .address_box{
  padding:2em;
}
.form01{
  /*max-width:800px;*/
  width:100%;
  /*margin:0 auto;*/
}
.form01 input[type=text]{
  font-size:60%;
}


.form01 .cell-head{
  background-color:#000;
  width:30%;
}
.form01 .cell-col{
  width:70%;
}

@media screen and (max-width: 768px) {
  header .toggle_box{
    display:block;
  }
  header .logo_box h1{
    display:none;
  }

  #main_box .main-left-box{
    padding-top:1em;
    padding-left:0em;
    padding-right:0.5em;
    margin-right:0px;
    float: none;
    width: 100%;
  }
  #main_box .main-center-box{
    float: none;
    width: 100%;
    margin-right:0px;
    padding-right:0px;
  }
  #main_box .main-left-box .side_menu{
    position:absolute;
    top:0px;
    z-index:2;
    width:100%;
    display:none;
    background-color:#FFF;
  }
  .form01{
    max-width:100%;
  }
  .form01 .head{
    max-width:100%;
  }
  .form01 .cell-head{
    width:100%;
  }
  .form01 .cell-col{
    width:100%;
  }
  .form01 .row.head .cell-col p{
    top:0px;
    text-align:center;
  }
}
