@media( max-width: 640px ){
  

  .pc_only,
  .pc_only02{
    display: none;
  }

  .sp_only{
    display: block;
  }

  .sp_only02{
    display: inline-block;
  }


  body{
    width: 100%;
    margin: 0 auto;
  }

  .block01 , .block02 , .block03 , .block04 , .block05 , .block06 , .block07 , .block08{
    margin-left: auto;
    margin-right: auto;
    width: 100%;
  }

  .block01{
    max-width: 1080px;
  }

  .block02{
    max-width: 700px;
  }

  .block03{
    max-width: 930px;
  }

  .block04{
    max-width: 1065px;
  }

  .block05{
    max-width: 1060px;
  }

  .block06{
    max-width: 824px;
  }

  .block07{
    max-width: 500px;
  }

  .block08{
    max-width: 890px;
  }

  /*header*/
  header{
    padding-bottom: 20px;
  }
  
  .header{
    position: relative;
    background-color: #281a14;
    z-index: 1;
  }

  .header::after{
    position: absolute;
    content: "";
    display: block;
    width: 100%;
    height: 1px;
    background: #fff;
    left: 0;
    top: 0;
    z-index: 5;
  }
  
  .logo-area #site-title{
    width: 55%;
  }
  
  .top.slider01{
    display: none!important;
  }
  
  .mypage-btn{
    top: 11px;
    right: 50px;
  }
  
  .mypage-btn a{
    width: 90px;
    /*padding: 5px 23px 5px 5px;*/
    padding: 0;
    border: 0;
  }

  .mypage-btn a::after{
    display: none;
    /*width: 20px;
    height: 20px;*/
  }

  
  .tel_block{
    display: none;
  }
  
  header .txt_link{
    position: absolute;
    bottom: 12px;
  }

  header .txt_link .flex li{
    margin-right: 1.2rem;
  }

  header .txt_link .flex li:last-child{
    margin-right: 0;
  }

  header .txt_link .flex a{
    display: block;
    height: 14px;
  }

  header .txt_link .flex a img{
    width: auto;
    height: 100%;
  }

  /*header end*/

  /*nav*/
  
  header nav{
    text-align: right;
  }
  
  header nav .flex{
    justify-content: flex-end;
    padding-right: 2%;
  }
  
  header nav a{
    font-size: 1.4rem;
    color: #000;
  }
  
  header nav .flex li{
    margin-right: 5px;
  }
  
  .mypage-btn .clip{
    max-width: 27px;
    max-height: 27px;
  }
  
  .mypage-btn .clip a{
    max-width: 27px;
    max-height: 27px;
    bottom: auto;
  }
  
  nav{
    width: 100%;
  }
  
  nav.search{
    background-color: #d7d1ea;
    padding: 20px 2%;
    margin-bottom: 30px;
  }

  nav.search .flex{
    justify-content: space-between;
  }

  nav.search li{
    margin-bottom: 15px;
  }

  nav.search li:nth-of-type(1),
  nav.search li:nth-of-type(2){
    width: 48%;
  }
  nav.search li:nth-of-type(3){
    width: 100%;
  }

  nav.search li a:hover{
    opacity: 0.7;
  }
  
  .search-navi.flex.sp_only{
    display: flex;
  }
  
  .search-navi .long{
    width: 100%;
  }
  
  .search-navi div.short,
  .search-navi div{
    width: 50%;
    margin-bottom: 0;
  }
  
  body.open{
    position: fixed;
    height: 100vh;
    overflow: unset;
  }
  
  .openbtn{
    /*ボタン内側の基点となるためrelativeを指定。
    追従するナビゲーションの場合はfixed＋top、rightといった位置をセットで指定*/
    position: absolute;
    /*background:#57a2c7;*/
    cursor: pointer;
    width: 50px;
    height:50px;
    border-radius: 5px;
    z-index: 150;
    right: 0;
    top: 0;
  }

  /*ボタン内側*/
  .openbtn span{
    display: inline-block;
    transition: all .4s;/*アニメーションの設定*/
    position: absolute;
    left: 14px;
    height: 3px;
    border-radius: 2px;
    background: #fff;
    width: 45%;
    z-index: 151;
  }

  .openbtn span:nth-of-type(1) {
    background: #004d25;
    top:15px;	
  }

  .openbtn span:nth-of-type(2) {
    background: #990000;
    top:23px;
  }

  .openbtn span:nth-of-type(3) {
    background: #0075c2;
    top:31px;
  }

  /*activeクラスが付与されると線が回転して×に*/
  .openbtn.active span:nth-of-type(1) ,
  .openbtn.active span:nth-of-type(3) {
    background: #7f7f7f;
  }

  .openbtn.active span:nth-of-type(1) {
    top: 18px;
    left: 18px;
    transform: translateY(6px) rotate(-45deg);
    width: 50%;
  }

  .openbtn.active span:nth-of-type(2) {
    opacity: 0;/*真ん中の線は透過*/
  }

  .openbtn.active span:nth-of-type(3){
    top: 30px;
    left: 18px;
    transform: translateY(-6px) rotate(45deg);
    width: 50%;
  }
  
  .openbtn.active .sp_menu{
    display: block;
    position: fixed;
    width: 100vw;
    height: 100vh;
    background: #fff;
    top: 0;
    left: 0;
    z-index: 150;
    overflow: scroll;
    padding-top: 10px;
    padding-bottom: 90px;
  }
  
  .openbtn.active .sp_menu span{
    background: none;
    transform: none;
    width: auto;
    position: unset;
    height: auto;
    text-align: left;
    font-size: 1rem;
  }

  .openbtn.active .sp_menu li a span.br{
    display: block;
    color: #fff;
    opacity: 1;
    text-align: center;
    font-size: 1.4rem;
  }
  
  .openbtn.active .sp_menu .sp_menu_logo{
    width: 66%;
    margin: auto;
  }
  
  .openbtn.active .sp_menu .mypage-btn02 {
    display: block;
    width: 90%;
    margin: 20px auto;
  }
  
  .openbtn.active .sp_menu .mypage-btn02 span{
    display: block;
  }
  
  .openbtn.active .sp_menu .mypage-btn02 a{
    display: block;
    width: 100%;
    background: #ed6d35;
    color: #fff;
    text-align: center;
    padding: 10px;
  }
  
  .openbtn.active .sp_menu li{
    width: 100%;
    border-bottom: 2px solid #fff;
  }
  
  .openbtn.active .sp_menu li a{
    display: block;
    background: #00608d;
    color: #fff;
    text-align: left;
    padding: 10px;
  }
  
  .openbtn.active .sp_menu .mypage-btn02 ul:nth-of-type(1) li:nth-of-type(1)  a{
    background: #ed6d35;
  }
  
  .openbtn.active .sp_menu .mypage-btn02 ul:nth-of-type(1) li:nth-of-type(2) a{
    background: #cc0033;
  }
  
  .openbtn.active .sp_menu ul:nth-of-type(1) li:nth-of-type(1) a{
    background: #00608d;
  }
  
  .openbtn.active .sp_menu ul:nth-of-type(1) li:nth-of-type(2) a{
    background: #004d25;
  }
  
  .openbtn.active .sp_menu ul:nth-of-type(1) li:nth-of-type(3) a{
    background: #990000;
  }
  
  .openbtn.active .sp_menu ul:nth-of-type(1) li:nth-of-type(4) a{
    background: #191970;
  }
  
  .openbtn.active .sp_menu ul:nth-of-type(1) li:nth-of-type(5) a{
    background: #0075c2;
  }
  
  .openbtn.active .sp_menu ul:nth-of-type(1) li:nth-of-type(6) a{
    background: #281a14;
  }
  
  /*nav end*/
  
  .top_border{
    height: 10px;
    background: #00608d;
    margin-bottom: 20px;
  }

  .recommendation .data li{
    width: 100%;
    background: #281a14;
    margin-bottom: 20px;
    margin-right: 0;
  }

  .recommendation .data a{
    width: 100%;
    overflow: hidden;
  }

  .recommendation .data a div{
    float: left;
  }

  .recommendation .data a div.img{
    width: 40%;
  }

  .recommendation .data a div.txt{
    width: 60%;
  }
  
  .news{
    width: 100%;
    margin: auto;
    padding: 20px;
  }

  .contents.block01{
    width: 90%;
    margin: auto;
  }
  
  .contents .flex{
    width: 100%;
  }
  
  .contents .flex div:first-child{
    width: 100%;
    margin-bottom: 60px;
  }
  
  .location p{
    font-size: 1.8rem;
  }
  
  .location address p , .location address{
    font-size: 1.6rem;
  }
  
  .useful .flex{
    display: block;
  }
  
  .useful li{
    width: 100%;
    text-align: center;
    margin-bottom: 30px;
  }
  
  .link-area .flex{
    padding: 20px;
  }
  
  .link-area .flex dl{
    width: 100%;
  }
  
  .news{
    /*padding-bottom: 200px;
    background-image: url("/asset/img/bg_circle01.png");
    background-position: center bottom;
    background-repeat: no-repeat;*/
  }
  
  .panorama{
    background: #f0e68c;
    padding: 30px 0;
    /*padding-bottom: 200px;
    background-image: url("/asset/img/bg_circle02.png");
    background-position: center bottom;
    background-repeat: no-repeat;*/
  }
  
  .panorama .flex{
    max-width: 100%;
    width: 100%;
    padding: 0
  }
  
  .panorama .flex li{
    max-width: 50%;
    border-radius: 15px;
    background: #fff;
    margin: auto 20px;
    padding: 15px;
  }
  
  .panorama .flex li h3.row1, .panorama .flex li h3.row2{
    display: block;
    height: 70px;
    width: 100%;
    position: relative;
  }
  
  .panorama .flex li h3.row1 span,
  .panorama .flex li h3.row2 span{
    display: inline-block;
    width: 100%;
    vertical-align: middle;
    text-align: center;
  }
  
  .panorama_slider .slick-list{
    width: 100%;
  }
  
  /*detail*/
  .property_top_block{
    padding-top: 86px;
  }
  
  .property_top_block .favorite_minibtn{
  }

  .property_top_block .favorite_minibtn{
    max-width: 226px;
    width: 50%;
    left: 10px;
  }

  .property_top_block .type01,
  .property_top_block .type02{
  }

  .property_top_block .type01{
  }

  .property_top_block .type02{
  }

  .property_top_block .bukken_title{
    margin-bottom: 40px;
  }

  .property_top_block .bukken_title h2{
  }

  .property_top_block .bukken_title h2 span{
    display: block;





    margin: auto;
  }


  .property_top_block{
    margin-bottom: 80px;
  }

  .property_top_block .slider_block .detail_slider{
    border :1px solid #d2d2d2;
    width: 600px;
    background-color: #fff;
    padding: 50px;
  }

  .property_top_block .slider_block .detail_slider .slick-list{
    margin: auto;
    width: 500px;
    height: 500px;
    position: relative;
  }

  .property_top_block .slider_block .detail_slider .slick-slide{
    text-align: center;
    margin: auto;
    width: 500px;
    height: 500px;
    background-color: #fff;
  }

  .property_top_block .slider_block .detail_slider .slick-slide img{
    max-height: 100%;
    height: auto;
    width: auto;
    max-width: 100%;
    margin: auto;
  }

  .property_top_block .slider_block .slick_thumb{
    width: 100%;
  }

  .detail_block .panorama.flex{
    max-width: 870px;
    width: 100%;
    margin: auto auto 120px;
    justify-content: space-between;
  }

  .detail_block .panorama.flex.panorama_btn02 div{
    max-width: 400px;
    width: 96%;
    margin: auto auto 20px;
  }

  .detail_block .panorama.flex.panorama_btn02 div:nth-of-type(2n){
    margin: auto auto 20px;
  }

  .detail_block .panorama.flex div a{
    display: block;
    border: 2px solid #191970;
    border-radius: 8px;
    padding: 30px 0;
    text-align: center;
    color: #000;
  }

  .detail_block .panorama.flex div a:hover{
    text-decoration: none;
    opacity: 0.7;
  }

  .update_date{
    text-align: right;
  }

  .property_data_block{
    margin-bottom: 80px;
  }

  .property_data_block ul li{
    display: flex;
    flex-wrap: wrap;
    border-bottom: none;
    border-right: 1px solid #979797;
  }

  .property_data_block ul li:first-child{
    border-top: 1px solid #979797;
  }

  .property_data_block ul li .item{
    border-left: 1px solid #979797;
    width: 164px;
    background-color: #d4d9dc;
    font-weight: bold;
  }

  .property_data_block ul li .data{
    width: calc( 100% - 164px );
    border-left: 1px solid #979797;
  }

  .property_data_block ul li.col4 .data{
    width: calc( 100% - 164px );
  }

  .property_data_block ul li .item,
  .property_data_block ul li .data{
    padding: 20px 0 20px 10px;
    border-bottom: 1px solid #979797;
  }

  .contact_btn02{
    width: 100%;
    max-width: 650px;
    margin: auto auto 80px;
  }

  .contact_btn02 a{
    width: 100%;
    display: block;
    text-align: center;
    color: #fff;
    font-size: 2.7rem;
    background-color: #942343;
    padding: 35px 0;
    border-radius: 8px;
  }

  .contact_btn02 a:hover{
    opacity: 0.7;
    text-decoration: none;
  }

  .contact_btn02 a i{
    margin-left: 1rem;
  }

  .gmap_i{
    width: 100%;
    margin-bottom: 80px;
  }

  .gmap_i iframe{
    width: 100%;
    height: 660px;
    border: 1px solid #979797;
  }

  .detail_contact_block{
    max-width: 515px;
    width: 96%;
    margin: auto auto 80px;
    text-align: center;
  }

  .detail_contact_block .txt{
    text-align: center;
  }

  .detail_contact_block .txt table th,
  .detail_contact_block .txt table td{
    vertical-align: middle;








    text-align: left;
  }

  .detail_contact_block .txt table th{
    font-weight: bold;
    font-size: 2.8rem;
    padding: 0 15px;
  }

  .detail_contact_block .txt table td{
  }

  .detail_contact_block .img:hover{
    opacity: 0.7;
  }

  .detail_contact_block .line{
    margin-bottom: 80px;
  }

  .detail_contact_block .line:hover{
    opacity: 0.7;
  }

  .detail_contact_block .flex{
    align-items: center;
    justify-content: space-between;
    margin-bottom: 10px;
  }

  .detail_contact_block .tel,
  .detail_contact_block .time{
    text-align: left;
  }

  .detail_contact_block .tel{
    font-size: 3rem;
    font-weight: bold;
  }

  .detail_contact_block .time p{
    font-size: 1.4rem;
    line-height: 1.2;
  }

  .detail_contact_block .email_btn{
    width: 100%;
  }

  .email_btn a i{
    margin-right: 2rem;
    font-size: 4rem;
  }

  .email_btn a{
    display: block;
    border-radius: 8px;
    color: #fff;
    background-color: #191970;
    padding: 20px;
    font-size: 1.8rem;
    position: relative;
  }

  .email_btn a:hover{
    opacity: 0.7;
    text-decoration: none;
  }

  .email_btn a span{
    position: relative;
    top: -8px;
  }

  .slider_block.flex{
    justify-content: space-between;
  }

  .slider_block.flex .slider{
    width: 600px;
    text-align: center;
  }
  
  .slider_block.flex{
    display: block;
  }
  
  .sp_slider01 , .sp_slider02{
    width: 100%;
    margin: auto;
    margin-bottom: 60px!important;
  }
  
  .sp_slider01{
  }
  
  .sp_slider02{
    border: 1px solid #c3c3c3;
    width: 80%;
  }
  
  .sp_slider01 .slick-list{
    width: 100%;
    height: 322px;
    background: #e5e5e5;
  }
  
  .sp_slider01 .slick-list img{
    width: auto;
    height: 322px;
    margin: auto;
  }
  
  .sp_slider02 .slick-list{
    width: 100%;
  }
  
  .sp_slider02 .slick-list img{
    width: auto;
  }
  
  .slider_block.flex .slider.pc_slider,
  .slider_block.flex .thumbnail.pc_slider{
    display: none;
  }

  .slider_block.flex .slider .slick-list{
    position: relative;
    width: 600px;
    height: 680px;
    background-color: #fff;
  }


  .slider_block.flex .slider .slick-list::before{
    display: block;
    content: "";
    width: 100%;
    height: 1px;
    background-color: #c7c7c7;
    position: absolute;
    bottom: 80px;
  }

  .slider_block.flex .slider .slick-list .slider-item{
    width: 100%;
    height: 600px;
    position: relative;
  }

  .slider_block.flex .slider .slick-list .slider-item img{
    position: absolute;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
    margin: auto;
  }

  .slider_block.flex .slider .slick-list .slider-item.wid img{
    width: 480px;
    height: auto;
  }

  .slider_block.flex .slider .slick-list .slider-item.hei img{
    width: auto;
    height: 480px;
  }
  

  .slider_block .sp_slider01 .slick-prev,
  .slider_block .sp_slider01 .slick-next{
    z-index: 20;
    top: 0;
    bottom: 0;
    margin: auto;
  }
  
  .slider_block .sp_slider02 .slick-prev,
  .slider_block .sp_slider02 .slick-next{
    z-index: 20;
    top: 0;
    bottom: -30px;
    margin: auto;
  }

  .slider_block .sp_slider01 .slick-prev{
    left: 5px;  
  }

  .slider_block .sp_slider01 .slick-next{
    right: 11px;
  }

  .slider_block .sp_slider02 .slick-prev{
    left: -34px;  
  }

  .slider_block .sp_slider02 .slick-next{
    right: -34px;
  }


  .slider_block .slick-prev::before,
  .slider_block .slick-next::before{
    content: "";
    width: 35px;
    height: 35px;
    display: block;
    background-position: center;
    background-size: 100%;
  }

  .slider_block .sp_slider01 .slick-prev::before,
  .slider_block .sp_slider01 .slick-next::before{
    content: "";
    width: 26px;
    height: 26px;
    display: block;
    background-position: center;
    background-size: 100%;
  }

  .slider_block .sp_slider02 .slick-prev::before,
  .slider_block .sp_slider02 .slick-next::before{
    content: "";
    width: 16px;
    height: 26px;
    display: block;
    background-position: center;
    background-size: 100%;
  }

  .slider_block .slick-prev::before{
    background-image: url(../img/slider/prev01.png);
  }

  .slider_block .slick-next::before{
    background-image: url(../img/slider/next01.png);
  }

  .slider_block .sp_slider01 .slick-prev::before{
    background-image: url(../img/slider/prev03.png);
  }

  .slider_block .sp_slider01 .slick-next::before{
    background-image: url(../img/slider/next03.png);
  }

  .slider_block .sp_slider02 .slick-prev::before{
    background-image: url(../img/slider/prev02.png);
  }

  .slider_block .sp_slider02 .slick-next::before{
    background-image: url(../img/slider/next02.png);
  }

  .slider_block.flex .thumbnail{
    width: calc( 100% - 640px );
  }

  .slider_block.flex .thumbnail .slick-track{
    transform: unset !important;
    width: 100% !important;
    display: flex;
    flex-flow: row wrap;
  }

  .slider_block.flex .thumbnail .slick-track::before,
  .slider_block.flex .thumbnail .slick-track::after{
    display: none;
  }


  .slider_block.flex .thumbnail .slick-slide{
    cursor: pointer;
    display: block!important;
    float: none !important;
  }

  .slider_block.flex .thumbnail .slick-slide:hover{
    opacity: 0.7;
  }

  .slider_block.flex .thumbnail .slick-slide.slider-item{
    width: 100px!important;
    height: 100px;
    border: 1px solid #c7c7c7;
    background-color: #fff;
    position: relative;
    margin-bottom: 5px;
    margin-right: 4px;
  }

  .slider_block.flex .thumbnail .slick-slide.slider-item img{
    position: absolute;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
  }

  .slider_block.flex .thumbnail .slick-slide.slider-item.hei img{
    width: auto;
    height: 100%;
    margin: auto;
  }

  .slider_block.flex .thumbnail .slick-slide.slider-item.wid img{
    width: 100%;
    height: auto;
    margin: auto;
  }

  .slider-area img {
    max-width: 100%;
    display: block;
    height: auto;
  }


  .slider-area {
    overflow: hidden;
    width: 100%;
    margin: auto;
  }

  .thumnail .slick-track {
    transform: unset !important;
    width: 100% !important;
    display: flex;
    justify-content: space-between;
    flex-flow: row wrap;
  }

  .thumnail .slick-slide {
    display: block!important;
    float: none !important;
    flex: 0 0 47.5%;
  }
  
  .detail_block .panorama{
    background: none;
  }

  .detail_block .panorama.flex div{
    max-width: 96%;
    width: 96%;
  }
  
  .request_block{
    width: 96%;
    margin: auto;
  }
  
  .request_block .request_banner{
    margin-bottom: 60px;
  }

  /*detail end*/
  
  /*subpage*/
  .sub_page_block{
    width: 100%;
    padding: 0 2%;
  }
  
  .sub_page_line::after{
    max-width: 100%;
    width: 100%;
    box-sizing: border-box;
  }
  
  .sub_page_menu{
    padding: 0 2%;
  }
  
  .sub_page_menu li{
    width: 49%;
    margin-bottom: 8px;
  }

  .sub_page_menu li:first-child{
    width: 100%;
  }
  
  .residence_map_area .area_ex li{
    width: 100%;
  }
  
  .sub_page_block.contact_page_form_block .contact_page_form01 table tr th,
  .sub_page_block.contact_form_block02.property table tr th{
    width: 100%;
    display: block;
    border-bottom: none;
    padding-bottom: 0;
  }

  .sub_page_block.contact_page_form_block .contact_page_form01 table tr th p,
  .sub_page_block.contact_form_block02.property table tr th p{
    margin: 0;
  }

  .sub_page_block.contact_page_form_block .contact_page_form01 table tr td,
  .sub_page_block.contact_form_block02.property table tr td{
    width: 100%;
    display: block;
  }
  
  .sub_page_block.contact_page_form_block .contact_page_form01 .kubun .flex li{
    width: 100%;
  }
  
  /*subpage end*/
  
  /*commission*/
  .commission_block{
    width: 96%;
  }
  
  .commission_banner .is-layout-flex{
    display: block;
  }

  .commission_banner .is-layout-flex figure,
  .commission_banner .is-layout-flex div.is-layout-constrained{
    width: 100%;
  } 
  
  .commission_contents_data{
    width: 100%;
    padding: 0 2%;
  }
  
  .commission_contents_img{
    display: none;
  }
  
  
  /*commission end*/
  
  /* heating */
 
  .gray_over .heating_txt{
    text-align: left;
    width: 100%;
  }
  
  .gray_over .heating_txt dt{
    width: 96%;
  }
  
  .gray_over .heating_txt dd{
    text-align: left;
    padding: 0 2%;
  }
  
  .heating_img_block .fukidashi{
    width: 137px;
    top: -100px;
    margin: auto;
  }
  
  body .is-layout-flex.fuel_block{
    display: block;
  }
  
  .fuel_block{
    width: 100%;
    padding: 15px 2%;
  }
  
  .fuel_block .fuel_type{
    width: 100%;
  }
  
  .fuel_block .fuel_ex p{
    margin: 0;
  }
  
  .refil_block{
    width: 100%;
  }
  
  /* heating end */
  
  /* flow */
  .flow_block .txt{
    width: 100%;
    margin-bottom: 60px;
  }
  
  .flow_block02 .flex div{
    width: 100%;
    padding: 20px 2%
  }
  
  .flow_block02 .flex div:nth-of-type(2){
    margin: 20px auto;
  }
  
  .flow_block03 .fl, .flow_block03 .fr{
    width: 100%;
    margin-bottom: 60px;
  }
  
  .flow_block03 .height_ajust{
    padding-bottom: 0;
  }
  
  /* flow end */
  
  /* faq */
  .faq_title{
    width: 100%;
  }
  
  .faq_block{
    width: 100%;
  }

  .faq_block dt{
    font-size: 1.7rem;
    padding-right: 2rem;
  }
  
  .faq_block dt::before,
  .faq_block dd::before{
    width: 28px;
    height: 25px;
    top:  13px;
  }
  
  .faq_block dt, .faq_block dd{
    padding-top: 10px;
    padding-left: 30px
  }
  /* faq end */
  
  /* panorama*/
  .panorama_list_block{
    width: 96%;
    margin: auto;
  }
  
  .panorama_list_block h3{
    border-left: 30px solid #fcc800;
  }
  
  .panorama_list_block ul.flex{
    justify-content: space-between;
  }

  .panorama_list_block li{
    width: 49%;
    margin: 0 0 30px 0;
    padding: 8px;
  }

  .panorama_list_block .panorama_btn div{
    width: 49%;
  }

  .panorama_list_block .panorama_btn a{
    font-size: 1.0rem;
    padding: 8px 0;
  }

  .panorama_list_block .panorama_btn div:last-child a{
    background: none;
    color: #000;
    position: relative;
    border: 2px solid #fcc800;
  }

  .panorama_list_block .panorama_btn div:last-child a::after{
    display: none;
  }

  /* panorama end */
  
  /* search */
  .pankuzu{
    width: 100%;
    margin: auto auto 100px;
    font-size: 2.0rem;
  }

  .search_map_block01,
  .search_map_block02{
    margin: auto auto 40px;
  }

  .search_map_block01{
    width: 96%;
  }

  .search_map_block02{
    width: 96%;
  }

  .search_map_block01 h2{
    font-size: 2.2rem;
    font-weight: bold;
    color: #004d25;
    margin-bottom: 10px;
    text-align: center;
  }

  .search_map_block01 .txt{
    font-size: 2.0rem;
  }

  .search_form_block01{
    width: 100%;
    margin: auto;
  }

  .search_form_block01 .faculty01{
    margin-bottom: 60px;
  }

  .search_form_block01 .faculty02{
    margin-bottom: 120px;
  }

  .search_form_block01 .faculty01 dt,
  .search_form_block01 .faculty02 dt{
    background: #deb887;
    font-weight: bold;
    font-size: 2.0rem;
  }

  .search_form_block01 .faculty02 dt{
    background: #ead7a4;
  }

  .search_form_block01 .faculty01 dt,
  .search_form_block01 .faculty01 dd,
  .search_form_block01 .faculty02 dt,
  .search_form_block01 .faculty02 dd{
    border: 1px solid #7f7f7f;
    padding: 30px 2%;
  }

  .search_form_block01 .faculty01 dd,
  .search_form_block01 .faculty02 dd{
    border-top: 0;
  }

  .search_form_block01 .faculty01 ul,
  .search_form_block01 .faculty02 ul{
    display: flex;
    flex-wrap: wrap;
    width: 100%;
  }

  .search_form_block01 .faculty01 ul li,
  .search_form_block01 .faculty02 ul li{
    max-width: 50%;
    width: 100%;
    margin-bottom: 10px;
  }

  .area_search{
    margin-bottom: 60px;
  }

  .area_search .flex{

    justify-content: space-between;
  }

  .area_search .area_map{
    max-width: 620px;
    width: 96%;
    margin: auto;
  }

  .area_search .area_data{
    width: 96%;
    margin: auto;
  }

  .area_search .area_map .txt h2{
    font-size: 2.4rem;
    position: relative;
    display: inline-block;

  }

  .area_search .area_map .txt h2::after{
    content: "";
    display: none;
    position: absolute;
    width: 57px;
    height: 57px;
    background-image: url("/asset/img/icon/loupe.png");
    background-position: center;
    background-repeat: no-repeat;
    background-size: 100%;
    right: -70px;
    top: -20px;
  }

  .area_search .area_map .txt h3{
    font-size: 2.0rem;
    margin-bottom: 30px;
  }

  .area_search .area_map .txt h2,
  .area_search .area_map .txt h3{
    font-weight: bold;
  }

  .area_search .area_list dt label{
    position: relative;
  }

  .area_search .area_list dt input[type=checkbox]{
    scale: 1.2;
    position: relative;
    top: -3px;
  }

  .area_search .area_list dt div{
    display: inline-block;
    margin-left: 10px;
    font-size: 2.0rem;
    font-weight: bold;
    line-height: 30px;
  }

  .area_search .area_list dt div span{
    display: inline-block;
    width: 30px;
    height: 30px;
    border-radius: 20px;
    color: #fff;
    text-align: center;
    margin-right: 5px;
  }

  .area_search .area_list dt div span{
    background: #c1436f;
  }

  .area_search .area_list dt:nth-of-type(2) div span{
    background: #00877b;
  }

  .area_search .area_list dt:nth-of-type(3) div span{
    background: #689dff;
  }

  .area_search .area_list dt:nth-of-type(4) div span{

    background: #ce662b;
  }

  .area_search .area_list dt:nth-of-type(5) div span{
    background: #3f1e7a;
  }

  .area_search .area_list dd{
    border-bottom: 1px solid #7f7f7f;
    padding: 15px;
    margin-bottom: 15px;
  }

  .search_add{
    text-align: center;

    margin-bottom: 60px;
  }

  .search_add .narrow_down{
    max-width: 574px;
    width: 96%;
    margin: auto;
  }

  .search_form_block02,
  .search_form_block02 dl{
    margin-bottom: 100px;
  }

  .search_form_block02 dl dt{
    background: #dcdcdc;
    font-weight: bold;
  }

  .search_form_block02 dl dt span{
    font-weight: normal;
    margin-left: 3rem;
  }

  .search_form_block02 dl dt,
  .search_form_block02 dl dd{
    border: 1px solid #7f7f7f;
    padding: 30px 20px;
  }

  .search_form_block02 dl dd{
    border-top: 0;
    border-bottom: 0;
  }

  .search_form_block02 dl dd:last-child{
    border-bottom: 1px solid;
  }

  .search_form_block02 dl dd li{
    margin-bottom: 20px;
  }

  .search_form_block02 dl dd .rent_block.flex{
    width: 100%;
    align-items: center;
    margin-bottom: 30px;
  }

  .search_form_block02 dl dd .rent_block div{
    width: 33%;
    max-width: 240px;
  }

  .search_form_block02 dl dd .rent_block div:nth-of-type(2){
    width: 30px;
    text-align: center;
  }

  .search_form_block02 dl dd select{
    background: none;
    border: 1px solid #7f7f7f;
    padding: 15px;
    width: 100%;
  }

  .search_form_block02 dd .floor_plan li{
    width: 100%;
  }

  .search_form_block02 dd .exclusive_area{
    width: 33%;
    max-width: 240px;
  }

  .search_form_block02 dd .chikunen li{
    width: 100%;
  }

  .search_form_block02 dd  li{
    width: 100%;
  }

  .search_form_block02 .search_btn{
    text-align: center;
  }

  .search_form_block02 .search_btn button{
    margin: auto;
    color: #fff;
    background: #00608d;
    text-align: center;
    cursor: pointer;
    border: none;
    max-width: 572px;
    width: 90%;
    padding: 40px 0 40px 20px;
    font-size: 2.4rem;
  }

  .search_form_block02 .search_btn button i{
    position: relative;
  }

  .search_form_block02 .search_btn button i::before{
    content: "";
    width:0;
    height:0;
    border-style: solid;
    border-width: 10px 0 10px 17.3px;
    border-color: transparent transparent transparent #FFFFFF;
    position: absolute;

    top: -2px;
    bottom: 0;
    left: -20px;
    margin: auto 0 auto;
    padding-right: 15px;
  }

  .search_form_block02 .search_btn button:hover{
    opacity: 0.7;
  }
  
  .student_union_sp_slider_block{
    display: block;
    background: #ffe4c4;
    padding: 60px 0;
  }
  
  .student_union_sp_slider_block .slick-slide{
      margin: 0 20px;
    border: 2px solid #dcdcdc;
    border-radius: 5px;
    background: #fff;
    padding: 3px;
  }

  .student_union_slider_block.flex{
    max-width: 100%;
    justify-content: space-between;
    margin-bottom: 120px;
  }

  .student_union_slider_block{
    width: 100%;
    /*border: 2px solid #c3c3c3;
    border-radius: 10px;*/
    border: none;
    padding: 30px 25px;
    margin: auto;
  }

  .student_union_slider_block .txt{
    width: 100%;
  }

  .student_union_slider_block .txt h2{
    text-align: center;
    font-weight:bold;
    font-size: 2.0rem;
  }

  .student_union_slider_block .student_union_slider{
    display: none;
    width: 100%;
  }

  .student_union_slider_block .student_union_slider .slick-slide{
    -ms-filter: none;
    filter: none;
  }

  .student_union_slider_block .student_union_slider .slick-prev,
  .student_union_slider_block .student_union_slider .slick-next{
    display: block;
    content: "";
    width: 40px;
    height: 64px;
    background-position: center;
    background-repeat: no-repeat;
    background-size: 100%;
    z-index: 5;
  }

  .student_union_slider_block .student_union_slider .slick-prev:hover,
  .student_union_slider_block .student_union_slider .slick-next:hover{
    opacity: 0.7;
  }

  .student_union_slider_block .student_union_slider .slick-prev{
    background-image: url("/asset/img/search/prev02.png");
    left: -20px;
  }

  .student_union_slider_block .student_union_slider .slick-next{
    background-image: url("/asset/img/search/next02.png");
    right: -20px;
  }

  .student_union_slider_block .student_union_slider .slick-prev::before,
  .student_union_slider_block .student_union_slider .slick-next::before{
    display: none;
  }

  .search02 h2{
    text-align: center;
    font-weight: bold;
    font-size: 2.0rem;
    color: #990000;
  }

  .coop_search_block{
    width: 100%;
    max-width: 985px;
    margin: auto auto 120px;
    position: relative;
  }

  .coop_search_block .img{
    position: relative;
    width: 125px;
    left: 0;
    right: 0;
    margin: auto;
  }

  .coop_search_block .txt{
    text-align: center;
    margin: auto;
  }

  .coop_search_block .txt h2{
    font-weight: bold;
    font-size: 2.0rem;
  }

  .coop_search_block .txt p{
    line-height: 2;
  }

  .search03 h2{
    text-align: center;
    font-weight: bold;
    font-size: 2.0rem;
    color: #191970;
  }

  .hokudai_search_block{
    width: 100%;
    max-width: 985px;
    margin: auto auto 120px;
    position: relative;
  }

  .hokudai_search_block .img{
    position: relative;
    width: 160px;
    left: 0;
    right: 0;
    margin: auto;
  }

  .hokudai_search_block .txt{
    text-align: center;
    margin: auto;
  }

  .hokudai_search_block .txt h2{
    font-weight: bold;
    font-size: 2.0rem;
  }

  .hokudai_search_block .txt p{
    line-height: 2;
  }

  .search04 h2{
    text-align: center;
    font-weight: bold;
    font-size: 2.0rem;
    color: #0075c2;
  }

  .all_electric_block01{
    max-width: 680px;
    width: 100%;
    margin: auto auto 120px;
    text-align: center;
    background: #281a14;
    color: #fff;
    padding: 40px;
    border-radius: 10px;
  }

  .all_electric_block01 h2{
    font-size: 2.0rem;
    font-weight: bold;
    align-items: center;
    display: flex;
    justify-content: center;
    margin-bottom: 30px;
  }

  .all_electric_block01 h2::before,
  .all_electric_block01 h2::after {
    background-color: #ffd700;

    border-radius: 3px;
    content: "";
    height: 3px;
    width: 40px;
  }
  .all_electric_block01 h2::before {
    margin-right: 10px;

    transform: rotate(60deg);
  }
  .all_electric_block01 h2::after {
    margin-left: 10px;

    transform: rotate(-60deg);
  }

  .all_electric_block01 p{
    line-height: 2;
  }
  
  .search01_block .txt{
    width: 96%;
    padding: 35px 15px;
  }

  .search01_block .search01_btn_block{
    width: 96%;
    margin: auto;
  }

  .search01_block .search01_btn_block .shows{
    max-width: 450px;
    width: 80%;
    margin: auto auto 60px;
  }

  .search01_block .search01_btn_block .sp_only .search01a,
  .search01_block .search01_btn_block .sp_only .search01b{
    width: 48%;
  }
  
  .search01_block .search01_btn_block .sp_only .search01a:hover,
  .search01_block .search01_btn_block .sp_only .search01b:hover{
    opacity: 0.7;
  }

  /* search end */
  
  /* request */
  .request_form_block h2.request_form_title,
  .request_form_block01,
  .request_form_attention,
  .request_form_block01 table{
    width: 100%;
  }
  
  .request_form_block01 table tr th{
    width: 33%;
  }

  .request_form_block01 table tr td{
    width: 67%;
  }

  
  /* request end */

  /* search contents */
  .search_block{
    width: calc( 100% - 730px );
  }
  
  .search_contents{
    display: none;
  }
  
  .search_list .search_block .search_contents.open{
    padding: 0;/**/
  }

  .search_contents.open{
    display: block;
    position: fixed;
    top: 0;
    left: 0;
    z-index: 200;
    width: 100%;
    height: 100%;
    overflow: scroll;
  }

  .narrow_down_block{
    display: block;
    background: #191970;
    position: fixed;
    text-align: center;
    bottom: 0;
    left: 0;
    margin: auto;
    width: 100%;
    padding: 15px 0;
    z-index: 20;
  }

  .narrow_down_block span{
    display: block;
    width: 80%;
    max-width: 240px;
    margin: auto;
    background: #ffffff;
    text-align: center;
    font-size: 1.4rem;
    color: #191919;
    padding: 15px;
    cursor: pointer;
  }

  .narrow_down_block span:hover{
    opacity: 0.7;
  }
  
  .search_block .search_title_block{
    background: #fff;
    padding-bottom: 20px;
  }

  .search_block .search_title_block p{
    text-align: center;
    font-size: 1.6rem;
    padding: 0 4%;
  }

  .search_block .search_title_block p:last-child{
    margin-bottom: 0;
  }

  .search_block .search_title{
    border: none;
    background-color: #f5deb3;
    margin-bottom: 20px;
    padding: 20px;
  }

  .search_block .search_title h2{
    border: none;
    text-align: left;
    color: #000;
    font-weight: bold;
  }

  .search_block .search_title h2 br{
    display: none;
  }
  
  .search_block .search_form .form_title{
    background: #b0c4de;
    padding: 15px 20px;
  }

  .search_block .search_form ul{
    padding: 20px 20px 0;
  }

  .search_block .search_form .gate ul{
    width: 100%;
    display: flex;
    flex-wrap: wrap;
  }

  .search_block .search_form .gate ul li{
    width: 50%;
    margin-bottom: 10px;
  }
  
  .search_block .sp_btn{
    width: 100%;
    background-color: #191970;
    display: block;
    text-align: center;
    padding: 20px 0;
  }
  
  .search_block .sp_btn i{
    position: relative;
    margin-right: 35px;
  }

  .search_block .sp_btn i::after{
    content: "";
    width: 30px;
    height: 30px;
    display: inline-block;
    position: absolute;
    background-image: url("/asset/img/icon/loupe02.png");
    background-size: 100%;
    background-position: center;
    
  }

  .search_block button{
    max-width: 240px;
    width: 100%;
    padding: 25px 0;
    color: #000;
    border-radius: 0;
    background-color: #ffa500;
    border: 0;
    font-size: 1.8rem;
    cursor: pointer;
  }

  .search_block button:hover{
    opacity: 0.7;
    text-decoration: none;
  }

  .search_block button i{
    margin-left: 1rem;
  }

  .budget p,
  .facility01 p,
  .facility02 p,
  .floor_plans p,
  .heater p,
  .detail p{
    font-weight: bold;
  }

  .budget p span,
  .facility01 p span,
  .facility02 p span,
  .floor_plans p span,
  .heater p span,
  .detail p span{
    font-weight: normal;
    margin-left: 2rem;
  }

  #pager.flex{
    justify-content: left;
  }
  
  .search_list .data #pager{
    width: 96%;
    margin: auto;
  }
  
  .search_list .data #pager li{
    padding: 0;
    margin: 0 1.5rem 2rem 1.5rem;
  }

  #pager.flex li{
    /*margin: 1rem;*/
  }


  #pager.flex li:last-child{
    margin-right: 1rem;
  }

  .hope_area{
    text-align: center;
    margin-bottom: 60px;
  }

  .hope_area .choise h2{
    margin-bottom: 20px;
  }

  .hope_area p span{
    font-weight: normal;
    margin-left: 2rem;
  }

  .choise_area{
    max-width: 893px;
    margin: auto;
  }

  .choise_area .flex{
    justify-content: space-between;
  }

  .choise_area .flex li{
    width: 392px;
    border: 2px solid;
    margin-bottom: 30px;
  }

  .choise_area .flex li:nth-of-type(1){
    border-color: #00008b;
  }


  .choise_area .flex li:nth-of-type(2){
    border-color: #dc143c;
  }

  .choise_area .flex li:nth-of-type(3){
    border-color: #c71585;
  }

  .choise_area .flex li:nth-of-type(4){
    border-color: #008b8b;
  }

  .choise_area .flex li input{
    transform: scale(3);
  }

  .choise_area .flex li{
    display: flex;
    align-items: center;
  }

  .choise_area .flex li .checkbox{
    text-align: center;
    width: calc( 100% - 298px );
  }

  .choise_area .flex li .img{
    width: 298px;
  }

  .arrow{
    width: 67px;
    margin: auto auto 15px;
  }

  .narrow_down{
    width: 504px;
    margin: auto auto 25px;
  }

  .narrow_down .txt{
    padding: 20px;
  }

  .rent_block{
    width: 550px;
    margin: auto auto 60px;
  }

  .rent_block table{
    width: 100%;
  }

  .rent_block table th,
  .rent_block table td{
    vertical-align: middle;
  }

  .rent_block table th{
    font-size: 1.8rem;
    width: 158px;
    text-align: left;
  }

  .rent_block table td{
    width: calc( 100% - 158px );
  }

  .rent_block table td .flex{
    align-items: center;
    justify-content: space-between;
  }

  .rent_block table td select{
    background: none;
    border: 1px solid;
    font-size: 1.9rem;
    padding: 20px 40px;
    border-radius: 8px;
    cursor: pointer;
  }

  .rent_block table td select:hover{
    background-color: #eee;
  }

  .rent_block .costincluded{
    padding: 20px;
    font-size: 1.9rem;
  }

  .rent_block .costincluded input[type=checkbox]{
    position: relative;
    transform: scale(1.5);
    vertical-align: middle;
    top: -3px;
    margin-right: 2rem;
  }

  .distance_block{
    width: 600px;
    margin: auto auto 60px;
  }

  .distance_block th,
  .distance_block td{
    text-align: left;
    vertical-align: top;
  }

  .distance_block th{
    width: 287px;
  }

  .distance_block th span{
    display: block;
    font-weight: normal;
  }

  .distance_block th{
    font-size: 1.9rem;
  }

  .distance_block td input[type=radio]{
    position: relative;
    transform: scale(1.5);
    vertical-align: middle;
    top: -3px;
    margin-right: 2rem;
  }

  .distance_block td li{
    margin-bottom: 10px;
  }

  .searchpage03 button{
    width: 500px;
    display: block;
    margin: auto;
    cursor: pointer;
    padding: 35px;
    text-align: center;
    border: 0;
    background-color: #202f55;
    color: #fff;
    font-size: 2.6rem;
    font-weight: bold;

  }

  .searchpage03 button:hover{
    opacity: 0.7;
    text-decoration: none;
  }

  .searchpage03 button i{
    margin-left: 1rem;
  }

  .search_form .radio li{
    display: flex;
  }

  .search_form .radio li div{
    width: 30px;
  }

  .search_form .radio li label{
    width: calc( 100% - 30px );
  }

  .search_form .floor_plans li,
  .search_form .heater li,
  .search_form .detail li{
    display: flex;
  }

  /* search contents end */
  
  /* search result */
  .result_title_block{
    position: relative;
  }
  
  .result_title h2,
  .result_title h3{
    font-size: 2rem;
    margin-left: 2%;
    margin-bottom: 20px;
  }
  
  .result_title h2{
    padding-top: 60px;
  }

  .result_back a{
    display: block;
    font-size: 2rem;
    font-weight: bold;
    color: #000;
    text-align: center;
    background: none;
    padding: 0;
    position: absolute;
    top: 0;
    right: 2%;
  }

  .result_back a span::before{
    border-color: #000;
    border-width: 2px;
  }
  
  .result_back02{
    text-align: right;
  }

  .result_back02 a{
    position: relative;
    display: inline-block;
    font-size: 2rem;
    font-weight: bold;
    color: #000;
    margin-left: auto;
    text-align: right;
    background: none;
    padding: 10px 10px 10px 0;
    width: inherit;
  }

  .result_back02 a span::before{
    border-color: #000;
    border-width: 2px;
  }

  .result_title_block.flex,
  .search_list.flex{
    display: block;
  }

  .search_list .data ul.flex{
  }

  .search_list .data li{
    border: 1px solid #c3c3c3;
    border-radius: 15px;
    padding: 10px;
    width: 96%;
    margin: auto auto 30px;
    margin-bottom: 30px;
  }

  .search_list .data li:nth-of-type(2n){
    margin-right: auto;
  }
  .result_title,
  .search_list .data,
  .result_back,
  .search_list .search_block{
    width: 100%;
    height: auto;
  }
  
  .search_list .data li div.flag_data{
    margin-bottom: 10px
  }
  
  .search_list .data li .type{
    margin-bottom: 10px;
  }
  
  .search_list .data li .map_no{
    top: 54px;
  }

  .search_list .data li .flex .data{
    width: calc( 100% - 110px );
  }
  
  .search_list .reserve01,
  .search_list .reserve02{
    padding: 2px;
    width: 49%;
  }

  /* search result end */
  
  /* other */
  .title03 p{
    color: #fff;
    font-size: 1.8rem;
    font-weight: bold;
    margin: 0;
  }
  
  .kowa_start{
    width: 96%;
    margin-left: auto;
    margin-right: auto;
  }
  
  .relief .flex div{
    width: 49%;
    margin-right: 2%;
  }
  
  .relief .flex div:nth-of-type(2n){
    margin-right: 0;
  }
  /* other end */
  
  /* footer */
  #footer h6{
    font-size: 1.6rem;
  }
  #footer h6 span{
    display: block;
    margin-right: 0;
  }
  #footer p, #footer address,#copyright{
    font-size: 1.3rem;
  }
  /* footer end */
  
  /* event */
  .tab.flex{
    justify-content: space-between;
  }
  
  .tab div{
    width: 46%;
  }
  
  .tab div a{
    display: block;
    border: 3px solid #ed1c24;
    text-align: center;
    padding: 20px 0;
    color: #000;
    font-weight: bold;
  }
  
  .tab div.on a{
    background: #ed1c24;
  }
  
  .tab{
    position: relative;
    border-bottom: 2px solid #ed1c24;
    padding-bottom: 16px;
    margin-bottom: 60px;
  }
  
  .tab::before{
    position: absolute;
    bottom: -43.3px;
    left: 5px;
    content: "";
    display: inline-block;
    vertical-align: middle;
    color: #ed1c24;
    line-height: 1;
    width: 0;
    height: 0;
    border-style: solid;
    border-color: transparent;
    border-width: 43.3px 25px;
    border-top-color: currentColor;
    border-bottom: 0;
  }
  
  .tab.tab02::before{
    left: auto;
    right: 5px;
  }
  
  .tour_block{
    padding: 0 2% 20px;
    margin-bottom: 40px;
    border: 0;
    border-bottom: 1px solid #000;
  }
  
  .tour_block h2{
    border: 0;
  }
  
  .tour_block .way_to_participate{
    padding: 0;
  }
  
  .tour_block .way_to_participate h4{
    color: #ed1c24;
    text-align: center;
    border-bottom: 2px dotted #555555;
    padding-bottom: 10px;
  }
  
  .tour_block .way_to_participate h4:nth-of-type(2){
    color: #000;
    text-align: center;
    border-bottom: 1px solid #000;
    border-top: 1px solid #000;
    padding: 5px 0;
  }
  
  .tour_block .way_to_participate dl{
    padding: 10px 0;
  }
  
  .tour_block .way_to_participate dl dt{
    font-weight: bold;
    padding: 0 2%;
    margin-bottom: 15px;
  }
  
  .tour_block .way_to_participate dl dd{
    padding: 0 2%;
    padding-bottom: 25px;
    margin-bottom: 25px;
    border-bottom: 2px dotted #555555;
  }
  
  .way_to_participate .square{
    border: 2px solid;
    display: inline-block;
    padding: 8px 15px;
    font-weight: bold;
    margin-bottom: 30px;
  }
  
  .time_schedule table{
    width: 100%;
    margin-bottom: 30px;
  }
  
  .time_schedule div th,
  .time_schedule div td{
    text-align: center;
    vertical-align: middle;
    padding: 3px;
    border: 1px solid #000;
  }

  .time_schedule div th{
    background: #c3c3c3;
    font-weight: bold;
  }

  .time_schedule div.sun th{
    background: #deb887;
  }

  .time_schedule div td:first-child{
    font-weight: bold;
  }

  .time_schedule div td a{
    background: none;
    padding: 0;
  }
  
  .time_schedule div td a img{
    max-width: 80px;
    width: 100%;
  }
  
  .tour_block .course_block{
    border: 3px solid;
    padding: 15px 12px;
    margin-bottom: 40px;
  }
  
  .tour_block .course_block.no01{
    border-color: #daa520;
  }
  
  .tour_block .course_block.no01 h3 span{
    color: #daa520;
  }
  
  .tour_block .course_block.no02{
    border-color: #9400d3;
  }
  
  .tour_block .course_block.no02 h3 span{
    color: #9400d3;
  }
  
  .tour_block .course_block.no02::after,
  .tour_block .course_block.no02 .arrow_b::before{
    background: #9400d3;
  }
  
  .tour_block .course_block.no03{
    border-color: #4169e1;
  }
  
  .tour_block .course_block.no03 h3 span{
    color: #4169e1;
  }
  
  .tour_block .course_block.no03::after,
  .tour_block .course_block.no03 .arrow_b::before{
    background: #4169e1;
  }
  
  .tour_block .course_block.no04{
    border-color: #800000;
  }
  
  .tour_block .course_block.no04 h3 span{
    color: #800000;
  }
  
  .tour_block .course_block.no04::after,
  .tour_block .course_block.no04 .arrow_b::before{
    background: #800000;
  }
  
  .tour_block .course_block.no05{
    border-color: #0000cd;
  }
  
  .tour_block .course_block.no05 h3 span{
    color: #0000cd;
  }
  
  .tour_block .course_block.no05::after,
  .tour_block .course_block.no05 .arrow_b::before{
    background: #0000cd;
  }
  
  .tour_block .course_block.no06{
    border-color: #c71585;
  }
  
  .tour_block .course_block.no06 h3 span{
    color: #c71585;
  }
  
  .tour_block .course_block.no06::after,
  .tour_block .course_block.no06 .arrow_b::before{
    background: #c71585;
  }
  
  .tour_block .course_block.no07{
    border-color: #3cb371;
  }
  
  .tour_block .course_block.no07 h3 span{
    color: #3cb371;
  }
  
  .tour_block .course_block.no07::after,
  .tour_block .course_block.no07 .arrow_b::before{
    background: #3cb371;
  }
  
  .tour_block .course_block.no02,
  .tour_block .course_block.no03,
  .tour_block .course_block.no04,
  .tour_block .course_block.no05,
  .tour_block .course_block.no06,
  .tour_block .course_block.no07{
    position: relative;
  }
  
  .tour_block .course_block.no02::after,
  .tour_block .course_block.no03::after,
  .tour_block .course_block.no04::after,
  .tour_block .course_block.no05::after,
  .tour_block .course_block.no06::after,
  .tour_block .course_block.no07::after{
    position: absolute;
    content: "";
    bottom: -22px;
    left: 0;
    right: 0;
    margin: auto;
    display: inline-block;
    height: calc(tan(60deg) * 25px / 2);
    width: 35px;
    clip-path: polygon(0 0, 100% 0, 50% 100%);
  }
  
  .tour_block .course_block h3{
    text-align: center;
    border-bottom: 1px solid #7f7f7f;
  }

  .tour_block .course_block p{
    font-weight: bold;
  }
  
  .tour_block .course_block .flex{
    justify-content: space-between;
  }
  
  .tour_block .course_block .flex div{
    width: 48%;
    margin-bottom: 20px;
  }

  .tour_block .course_block .flex div a{
    display: block;
    background: #daa520;
    text-align: center;
    padding: 20px;
    color: #000;
    font-size: 2.0rem;
    font-weight: bold;
    border: none;
  }

  .tour_block .course_block .flex div a::after{
    display: block;
    content: "";
    width: 10px;
    height: 10px;
    border-top: solid 2px #000;
    border-right: solid 2px #000;
    transform: rotate(135deg);
    left: 0;
    right: 0;
    margin: auto;
  }
  
  .tour_block .course_block .flex div a:hover{
    opacity: 0.7;
    text-decoration: none;
  }
  
  .tour_block .course_name{
    border-left: 10px solid #daa520;
    padding: 15px 0 15px 10px;
    margin-bottom: 20px;
  }

  .tour_block .course_name h2{
    font-size: 2.0rem;
  }

  .tour_block .course_name h3{
    font-size: 1.8rem;
  }

  .tour_block .course_block a,
  .tour_block .course_name a{
    color: #000;
    text-decoration: none;
    border-bottom: 1px solid #0000ee;
  }
  
  .tour_block .course_block .arrow_b{
    margin-bottom: 20px;
  }
  
  .tour_block .course_block .arrow_b::before{
    height: calc(tan(60deg) * 24px / 2);
    width: 24px;
    left: 0;
    right: 0;
  }
  
  .reserve_date table{
    margin: auto auto 20px;
  }

  .reserve_date th,
  .reserve_date td{
    display: block;
  }
  
  .reserve_date th{
    border-top: 1px solid #000;
    border-bottom: 1px solid #000;
    font-weight: bold;
    font-size: 2.0rem;
    margin-bottom: 10px;
  }
  
  .reserve_date td{
    text-align: right;
  }
  
  .way_to_participate h4{
    font-weight: bold;
  }
  
  .way_to_participate li{
    margin-bottom: 10px;
  }
  
  /* event end */
  
  /* international student */
  
  .international_student .title_block p::before,
  .international_student .title_block p::after{
    display: none;
  }
  
  .international_student .title_block{
    max-width: 100%;
  }
  
  .international_student .title_block p{
    padding: 0;
  }
  
  .international_student .link_block{
    max-width: 100%;
  }
  
  .international_student .property_data li{
    width: 100%;
    margin-right: 0;
  }
  
  .international_student .property_data .flex.sp_only{
    display: flex;
    justify-content: space-between;
  }
  
  .international_student .property_data li .btn{
    width: 49%;
    background: none;
  }
  
  .international_student .property_data li .btn.pdf{
  }
  
  .international_student .property_data li .btn.pdf .space{
    display: block;
    height: 1px;
  }
  
  .international_student .property_data li .btn.pdf .border{
    border: none;
  }
  
  .international_student .property_data li .btn.pdf a{
    padding: 0;
    margin: auto;
  }
  
  .international_student .property_data li .btn a{
    /*font-size: 1.8rem;
    line-height: 1.8rem;
    padding: 30px 0;*/
    padding: 0;
  }
  
  .international_student .property_data li .btn a::after{
    display: none;
  }
  
  /*.international_student .property_data li .btn a::after{
    width: 32px;
    height: 25px;
    background-image:url("/asset/img/icon/ico_mail02.png");
    margin: auto 10px auto;
  }*/
  
  .international_student .step_block{
    overflow: hidden;
  }
  
  .international_student .step .contents{
    float:right;
    width: calc( 100% - 60px );
  }
  
  .international_student .step .contents li:first-child{
    font-weight: bold;
  }
  
  .international_student .step .number{
    float: left;
    position: relative;
    width: 50px;
    height: 50px;
    border-radius: 25px;
    text-align: center;
    background: #00608d;
    color: #fff;
    font-size: 1.8rem;
    line-height: 1;
  }
  
  .international_student .step .number div{
    display: inline-block;
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    margin: auto;
    padding-top: 8px;
  }
  
  .international_student .step .number span{
    display: block;
    font-size: 1.4rem;
  }
  
  .international_student .step_block{
    border-bottom: 1px dotted #000;
    padding-bottom: 20px;
  }
  
  /* international student end */
  
  /* know here */
  /* know here end */

  /* hotline */
  .hotline_img{
    max-width: 343px;
    margin: 40px auto 60px;
  }


  .hotline_block dl{
    padding: 20px 2%;
  }

  .hotline_flow_title{
    width: 100%;
    max-width: 375px;
  }

  .hotline_flow li{
    display: block;
    flex-wrap: nowrap;
    justify-content: normal;
    padding: 20px 2%;
  }

  .hotline_flow li .step{
    display: block;
    width: 90px;
    height: 90px;
    margin: auto auto 20px;
  }

  .hotline_flow li .txt{
    width: 100%;
  }

  .hotline_btn{
    width: 100%;
    max-width: 770px;
    margin: auto auto 80px;
  }

  .hotline_btn a::after{
    width: 2rem;
    height: 2rem;
    border-top: solid 3px #fff;
    border-right: solid 3px #fff;
    right: 4%;
    margin: auto;
  }

  /* hotline end */
  
  /* housing center */
  .housing_center .housing_center_img{
    width: 100%;
    max-width: 360px;
    margin-left: auto;
    margin-right: auto;
  }

  .housing_center .housing_center_btn{
    width: 90%;
    max-width: 640px;
    margin-left: auto;
    margin-right: auto;
  }

  .housing_center .housing_center_btn a{
    padding: 20px 0;
    text-align: center;
  }

  .housing_center .housing_center_btn a span::after{
    top: 2rem;
    bottom: auto;
    right: -40px;
    margin: 0 auto;
  }

  .housing_center .flow h3{
    text-align: left;
    margin-bottom: 70px;
  }

  .housing_center .flow dl{
    padding: 20px 2%;
  }

  .housing_center .schedule{
    width: 100%;
    max-width: 600px;
    border: none;
    padding: 0 0;
    margin-bottom: 60px;
  }

  .housing_center .schedule dl dt:first-child{
    border-top: 3px dotted #000;
    padding-top: 20px;
  }


  /* housing center end */
  
  /* key */
  .key_img{
    max-width: 350px;
    margin-bottom: 30px;
    margin-left: auto;
    margin-right: auto;
  }

  .key .key_reserve{
    position: relative;
  }

  .key .key_reserve::before,
  .key .key_reserve::after{
    position: unset;
    display: block;
    content: "";
    width: 50px;
    height: 50px;
    margin: auto auto 15px;
    background: #ffc90e;
  }

  .key .key_reserve p{
    padding: 0;
  }

  .key .prepare{
    width: 90%;
    max-width: 370px;
    margin-left: auto;
    margin-right: auto;
  }

  .key .prepare p{
    margin-bottom: 20px;
  }

  .key .prepare p:last-child{
    margin-bottom: 0;
  }

  .key .flow li{
    margin-bottom: 30px;
    padding: 20px 2%;
  }

  .key .flow li .no{
    margin-bottom: 20px;
  }

  .key .flow li h3{
    padding-bottom: 5px;
    margin-bottom: 20px;
  }

  .key .flow li .txt h4{
    margin-bottom: 10px;
  }

  .key .flow li .flex{
    display: block;
  }

  .key .flow li .txt{
    position: unset;
    width: 100%;
  }

  .key .flow li .txt::after{
    display: none;
  }

  .key .flow li .btn{
    width: 100%;
  }

  .key .flow li .btn a{
    text-align: left;
    padding: 15px;
  }

  .key .flow li .schedule th,
  .key .flow li .schedule td{
    border: 1px solid #c3c3c3;
    padding: 5px 20px;
  }

  .key .flow li .schedule th{
    background: #ccd9e3;
  }

  .key .notes{
    padding: 15px;
    background: #eee;
  }

  .key .notes dt{
    font-weight: bold;
  }

  .key .notes dt,
  .key .notes dd{
    margin-bottom: 10px;
  }

  /* key end */
  
  /* reservation */
  .reservation_before_passing .reservation_block h3.center{
    text-align: left;
    padding: 10px;
  }
  
  .reservation_before_passing .calender{
    padding: 20px 2%;
  }
  
  .reservation_before_passing .calender h4::after{
    margin-left: 8px;
  }

  .reservation_before_passing .calender h4::before{
  margin-right: 8px;
  }
  
  .reservation_before_passing .calender .img{
    margin: auto;
  }
  
  .reservation_before_passing .calender .img,
  .reservation_before_passing .calender .txt{
    width: 100%;
  }
  
  .reservation_before_passing .calender .txt th,
  .reservation_before_passing .calender .txt td{
    text-align: left;
    width: 100%;
    display: block;
  }
  
  .reservation_before_passing .calender .txt th{
    font-weight: bold;
    border-bottom: 0;
    padding-bottom: 0;
  }
  
  .reservation_before_passing .calender .txt td p{
    text-indent: -1rem;
    margin-left: 1rem;
  }
  
  .reservation_before_passing .calender .txt td span.sp_only02{
    color: #00008b;
  }
  
  .reservation_before_passing .reservation_date{
  }
  
  .reservation_before_passing .reservation_date .course_detail p.center,
  .reservation_before_passing .reservation_date .course_detail .flex div h3{
    text-align: left;
  }
  
  .reservation_before_passing .reservation_date .course_detail .flex div h3{
    margin-bottom: 10px;
  }
  
  .reservation_before_passing .reservation_date .course_detail .flex.multi,
  .reservation_before_passing .reservation_date .course_detail .flex div{
    width: 100%;
  }
  
  .reservation_before_passing .reservation_date .course_detail .flex div{
    padding: 10px;
  }
  
  .reservation_before_passing .reservation_date dl dd{
    padding: 0;
  }
  
  .reservation_before_passing .time_table div th, .reservation_before_passing .time_table div td{
    padding: 5px;
    font-size: 1.4rem;
  }
  
  .reservation_before_passing .reservation_date dl dt{
    padding: 10px;
  }
  
  .reservation_before_passing .reservation_date .time_table div{
    width: 100%;
  }
  
  .reservation_before_passing .time_table div td a{
    width: 94%;
    margin: auto;
    max-width: 77px;
  }
  
  .reservation_before_passing .reservation_block .form_banner_block h3{
    padding-left: 0;
  }
  
  .reservation_before_passing .reservation_block .form_banner_block p.ex{
    text-align: left;
  }

  .reservation_before_passing .reservation_block .form_banner_block h3::after,
  .reservation_before_passing .reservation_block .form_banner_block h3::before{
    content: "";
    background: #000;
    width: 30px;
    height: 30px;
    display: block;
    position: relative;
    top: 5px;
  }

  .reservation_before_passing .reservation_block .form_banner_block h3::after,
  .reservation_before_passing .reservation_block .form_banner_block h3::before{
    margin:10px auto;
  }

  .reservation_before_passing .reservation_block .form_banner_block .flex{
    justify-content: space-between;
  }

  .reservation_before_passing .reservation_block .form_banner_block .flex li{
    width: 100%;
    max-width: 100%;
    padding: 20px 4%;
  }


  
  /* reservation end */
  
  /* unifrate n18 */
  .unifraten18 .unifrate_content.flex{
    width: 100%;
    display: block;
  }

  .unifraten18 .unifrate_content .out{
    max-width: 315px;
    width: 100%;
    margin: auto auto 30px;
    text-align: center;
  }

  .unifraten18 .unifrate_content .ex{
    max-width: 663px;
    width: 100%;
    text-align: center;
  }

  .unifraten18 .unifrate_madori .vacancy{
    margin-left: auto;
    margin-right: auto;
    margin-bottom: 40px;
    max-width: 494px;
    width: 100%;
  }

  .unifraten18 .unifrate_madori ul{
    display: block;
    width: 100%;
  }

  .unifraten18 .unifrate_madori li{
    width: 100%;
    max-width: 448px;
  }

  .unifraten18 .panorama{
    width: 96%;
    max-width: 96%;
    margin: auto;
    background: none;
  }

  .unifraten18 .panorama ul.flex{
    width: 100%;
    display: block;
  }

  .unifraten18 .panorama li{
    width: 100%;
    max-width: 450px;
    border: none;
    background: none;
    padding: 0;
    margin: 0 auto 20px;
  }

  .unifraten18 .panorama li a:hover{
    opacity: 0.7;
  }

  .unifraten18 .detail_btn a{
    display: block;
    width: 80%;
    max-width: 400px;
    margin: auto auto 60px;
    background: #191970;
    font-size: 2.2rem;
    text-align: center;
    color: #fff;
    padding: 20px 0;
  }

  .unifraten18 .detail_btn a span{
    position: relative;
  }

  .unifraten18 .detail_btn a span::after{
    position: absolute;
    content: "";
    left: calc( 100% + 20px );
    top: 0;
    bottom: 0;
    margin: auto;
    width: 10px;
    height: 10px;
    border-top: 2px solid #fff;
    border-right: 2px solid #fff;
    -webkit-transform: rotate(45deg);
    transform: rotate(45deg);
  }

  .unifraten18 .detail_btn a:hover{
    opacity: 0.7;
    text-decoration: none;
  }

  /* unifrate n18 end */
  
  /* housing entry sapporo hakodate */
  
  .housing_entry .application h2{
    text-align: left;
  }
  
  .housing_entry .application .flex li{
    width: 100%;
    max-width: 100%;
    margin-bottom: 30px;
  }
  
  .property_list_col2 li{
    width: 100%;
    margin: 0 0 20px 0;
  }
  
  .property_list_col2 li .reccomend,
  .property_list_col2 li:nth-of-type(2n+1) .reccomend{
    background-color: #000;
  }

  .property_list_col2 li:nth-of-type(2n) .reccomend{
    background-color: #8b0000; 
  }
  
  /* housing entry end*/

}