@charset "utf-8";

/* PC版非表示 */
@media screen and ( min-width:768px ){
#head_logo{
  display: none;
}
#head_hiraku{
  display:none;
}
#sp_head_form{
  display: none;
}
.pc_hidden{
  display: none;
}

/* PC版非表示 閉じ */
}

/* SP用定義 */
@media screen and ( max-width:768px ) {

    /* ボタンのデフォルト(丸くなるやつ)を無効 */
    input[type="submit"],button,input[type="button"] {
      -webkit-appearance: none;
      border-radius: 0;
    }
    input[type="text"],input[type="password"],input[type="number"],select{
      font-size: 16px;
    }

#side_menu{
  display: none;
}
#head_text{
  display: none;
}

#head_menu_area{
  display: none;
}

#top_menu{
  width: 100%;
  background-color: #f0f0f0;
  z-index: 1000;
  height: auto;
  padding: 10px 0 5px 0;
}
/* ヘッダーロゴ */
#head_logo{
  float:left;
  margin-left: 10px;
}
#head_logo img{
  height: 25px;
}

/* ヘッダードロワーメニュー */
#head_hiraku{
  float:right;
  margin-right: 10px;
}

.side_h2{
  display: inline;
  padding: 5px 0;
  font-size: 100%;
}

.accordion{
  font-size: 90%;
}
.accordion h2{
  display: none;
}
.accordion ul li p{
  margin: 5px 0;
  font-size: 90%;
}

.accordion select,.accordion input[type="text"]{
  margin-bottom: 10px;
  border: 1px #aaa solid;
  border-radius: 2px;
  padding: 5px 7px;
  width: 100%;
}

#main{
  margin: 10px 5px 0 0;
  min-width: auto;
}

.select_area{
  margin-top: 10px;
  font-size: 80%;
}

.select_area li{
  width: calc(50% - 5px);
  margin-left: 5px;
  margin-right: 0;
}

/* homeスライダー */
#top_slider{
  margin: 40px 5px 0 0;
  width:100%;
  height: 450px;
  background: #fff;
}
#top_slider div{
  width: 100%;
}
#top_slider_logo img{
  width: 200px;
}
#top_slider_logo li{
  width: calc(100% - 10px);
  box-sizing: border-box;
}
#top_slider_logo h2{
  font-size: 80%;
}

/* ページタイトル */
#page_head{
  margin: 38px 0 0 0;
  width: 100%;
}
/* 検索条件表示部分 */
#head_search{
  display: block;
  margin-left: 0;
  margin-top: 5px;
}

#head_form{
  display: none;
}

/* ページ上部の検索用アコーディオン */
#sp_head_form{
  width: 100%;
  padding: 10px 0;
  box-sizing: border-box;
  background: #ccc;
}
#sp_head_form a{
  color: #000;
  font-weight: bold;
  display: block;
  text-align: center;
}
#sp_head_form ion-icon{
  font-size: 110%;
}
.toggle_area{
}
.child {
    display: none;
}
.inner{
  box-sizing: border-box;
  width: 100%;
  padding: 10px 20px;
  background: #eee;
  text-align: center;
}
.inner select{
  width: auto;
  margin: 10px 0;
  font-size: 100%;
}
.inner li{
  display: block;
}
.inner input[type="text"]{
  padding: 5px 10px;
  border: 1px solid #aaa;
  margin: 10px 0;
}
.inner input[type="submit"]{
  margin-top: 10px;
}
.radio_area{
  width: 100%;
  text-align: center;
}
#sp_head_form input[type="submit"]{
  font-size: 110%;
  padding: 7px 15px;
}
.menu:after {
    position: absolute;
    top: 50%;
    right: 10px;
    margin-top: -14px;
    content: '>';
    font-size: 14px;
    font-weight: bold;
    -moz-transform: rotate(90deg);
    -ms-transform: rotate(90deg);
    -webkit-transform: rotate(90deg);
    transform: rotate(90deg);
    -moz-transition: all, 0.25s, linear;
    -o-transition: all, 0.25s, linear;
    -webkit-transition: all, 0.25s, linear;
    transition: all, 0.25s, linear;
}

.menu.active:after {
    -moz-transform: translate(0, 50%);
    -ms-transform: translate(0, 50%);
    -webkit-transform: translate(0, 50%);
    transform: translate(0, 50%);
    -moz-transform: rotate(-90deg);
    -ms-transform: rotate(-90deg);
    -webkit-transform: rotate(-90deg);
    transform: rotate(-90deg);
}
.radio_area{
  margin-top: 10px;
}

#page_title_box{
  width: 100%;
  margin: 0;
}

#main_left{
  width: calc(100% - 5px);
  min-width: auto;
  float: none;
  margin-left: 5px;
}
#main_right{
  display: none;
}
.page_content_area th,.page_content_area td{
  display: block;
  width: auto;
}
.page_content_area th{
  padding-bottom: 0;
}
.page_content_area td{
  padding-top: 0;
}

.modal_area{
  width: 100%;
}
.modaal-wrapper .modaal-close{
  background: #eee;
  box-shadow: 0px 0px 4px #000;
}
.modaal-close:after, .modaal-close:before{
  background: #000;
}
.form_modal{
  width: calc(100% - 10px);
}

.text_area,.countion_area{
  width: calc(100% - 10px);
  margin: 0 auto;
  word-break: break-all;
}
.page_content_text{
  word-break: break-all;
}
.kiyaku_area{
  width: calc(100% - 10px);
  margin: 20px auto;
}
#rule_box {
    width: calc(100% - 20px);
}
.pictext_area{
  width: calc(100% - 10px);
}
.pictext_area img{
  width: 100%;
  border-radius: 3px;
}
.pictext_area div{
  width: 100%;
  margin-top: 10px;
}
.home_bt_area{
  font-size: 120%;
}
.home_area,.home_area2{
  width: calc(100% - 5px);
  padding: 10px 0;
  margin: 0;
}
.home_area .select_area,.home_area2 .select_area{
  margin-left: 0px;
}
#sp_sns{
  text-align: center;
}
#sp_sns i{
  margin: 0 5px;
}
.login_box{
  width: 100%;
}
.login_box input[type="text"],.login_box input[type="password"]{
  font-size: 16px;
}

#lp_main{
  margin: 0;
  width: 100%;
  min-width: auto;
}
#user_head,#concept_head{
  min-height: auto;
}
#user_head_text,#concept_head_text,#user_tutorial{
  padding: 40px 0;
  width: 100%;
}
#user_head_text{
  background-color: rgba(244,244,244,0.5);
}
#user_head_text div,#user_concept_text div,#concept_head_text div,#main_concept_text div{
  width: calc(100% - 20px);
  margin: 0 auto;
}
#main_concept_text div{
  margin: 40px 0;
}
#user_head_text h2,#user_concept_text h2,#concept_head_text h2,#user_tuto_text h2{
  font-size: 160%;
}
#user_head_text button,#user_concept_text button,#concept_head_text button,#main_concept_text{
  width: calc(100% - 20px);
}
#user_tutorial_area{
  padding: 0;
}
#user_tuto_text,#user_tuto_video{
  width: calc(100% - 20px);
  margin: 0 auto;
  display: block;
}
#user_tuto_video{
  margin-top:20px;
}
#user_tuto_text button{
  width: calc(100% - 20px);
  display: block;
  margin: 0 auto;
}
#user_list h2{
  font-size: 160%;
}
#user_list ul{
  display: block;
  min-width: auto;
  max-width: auto;
  width: 100%;
}
#user_list li{
  width: calc(100% - 20px);
  margin: 5px auto;
}
#user_list button{
  width: calc(100% - 20px);
}
#user_concept,#main_concept {
  min-height: auto;
}
#concept_head,#main_concept{
  background-image: none;
  padding-bottom: 0;
}
#user_concept_text,#main_concept_text{
  background-color: rgba(248,248,248,0.5);
  position: static;
}
#user_concept_text{
  padding-bottom: 40px;
}
#user_concept_text div,#main_concept_text div{
  position: static;
}
#user_footer_bt{
  width: calc(100% - 10px);
  margin: 0 auto;
}
#user_footer_bt p{
  text-align: left;
}
#user_footer_bt button{
  width: calc(100% - 10px);
  padding: 13px 0;
  border-radius: 5px;
  font-size: 110%;
}
#staff_table{
  min-width: auto;
  width: calc(100% - 20px);
}
#staff_table h3{
  font-size: 130%;
}
#staff_table th,#staff_table td{
  width:100%;
  display: block;
  padding: 4px 10px;
}
#staff_table th{
  font-size: 80%;
  border: none;
}
.login_area p{
  text-align: left;

}


/* レスポンシブ閉じ */
}
