@charset "utf-8";

/* スタイルシート

作成者：Hirama Inc.
作成日 : 2022.03.01
-------------------------------------------------------------------------------------*/

.page {}


/*************************************************************************************
**************************************************************************************

utility

**************************************************************************************
**************************************************************************************/

.page #main {}

/******************************

block

*******************************/

.page #main .block {
width: 100%;
height: 100%;
}

@media only screen  and (min-width: 1151px){
.page #main .block {
padding: 2rem 0;
}
}

@media only screen  and (min-width: 701px)  and (max-width: 1150px){
.page #main .block {
padding: 2rem 0;
}
}

@media only screen  and (min-width: 481px)  and (max-width: 700px){
.page #main .block {
padding: 2.25rem 0;
}
}

@media only screen and (max-width: 480px){
.page #main .block {
padding: 2rem 0;
}
}

/******************************

inner

*******************************/

.page #main .inner {
width: 100%;
margin: 0 auto;
}

@media only screen  and (min-width: 1151px){
.page #main .inner {
max-width: 1100px;
}
}

@media only screen  and (max-width: 1150px){
.page #main .inner {
padding: 0 3%;
}
}

/******************************

btn

*******************************/

.page #main .btn {
margin: 0 auto;
}  

.page #main .btn a {
position: relative;
display: block;
width: 100%;
padding:.5rem 1rem .5rem .7rem;
background-color: #39B4BE;
color: #FFF;
border-radius: 50px;
text-align: center;
}  

@media only screen  and (min-width: 701px){
.page #main .btn a {
padding:.5rem 1rem .5rem .7rem;
}  
}

@media only screen  and (min-width: 481px)  and (max-width: 700px){
.page #main .btn a {
padding:.5rem 1rem .5rem .7rem;
font-size: 1.2rem;
}  
}

@media only screen and (max-width: 480px){
.page #main .btn a {
padding:.5rem 1rem .5rem .7rem;
}  
}

.page #main .btn a::before{
content: "";
display: block;
position: absolute;
top: 0;
bottom: 0;
right: 25px;
margin: auto;
width: 15px;
height: 2px;
background: #FFF;
transition: .3s;
}

.page #main .btn a::after{
content: "";
display: block;
position: absolute;
top: 0;
bottom: 0;
right: 25px;
margin: auto;
width: 8px;
height: 8px;
border-left: 2px solid #FFF;
border-bottom: 2px solid #FFF;
transform: rotate(-135deg);
transition: .3s;
}

.page #main .btn a:hover::before{
right: 5px;
width: 25px;
}

.page #main .btn a:hover::after{
right: 5px;
}


/*************************************************************************************
**************************************************************************************

floormap

**************************************************************************************
**************************************************************************************/

.floormap {}

.floormap #main {
padding-bottom: 0rem;
}

.floormap a:hover polygon,
.floormap a:hover path,
.floormap a:hover polyline,
.floormap a:hover rect {
opacity: 0.3;
-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=30)";
}

/*SVG*/
#map01 a:hover,
#map02 a:hover {
opacity: 0.7;
-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=70)";
}


/*floor1*/
.floormap #main .st0{fill:#18B7CD;}
.floormap #main .st1{fill:#B3B3B3;}
.floormap #main .st2{fill:#D5E8C3;}
.floormap #main .st3{fill:#00A85F;}
.floormap #main .st4{fill:#56931F;}
.floormap #main .st5{fill:#6FB92C;}
.floormap #main .st6{fill:#A2CD6A;}
.floormap #main .st7{fill:#C0DC96;}
.floormap #main .st8{fill:#231815;}
.floormap #main .st9{fill:#F08F69;}
.floormap #main .st10{fill:#00B1BB;}
.floormap #main .st11{fill:none;}
.floormap #main .st12{fill:#DC7693;}
.floormap #main .st13{fill:#6C69AD;}
.floormap #main .st14{fill:#C1DA80;}
.floormap #main .st15{fill:#EB7AAB;}
.floormap #main .st16{fill:#A9CE52;}
.floormap #main .st17{fill:#009A63;}
.floormap #main .st18{fill:#A3D4BC;}
.floormap #main .st19{fill:#36B38A;}
.floormap #main .st20{fill:#CDE3AD;}
.floormap #main .st21{fill:#E85377;}
.floormap #main .st22{fill:#F6C3C8;}
.floormap #main .st23{fill:#EF8E9D;}
.floormap #main .st24{fill:#009FE8;}
.floormap #main .st25{fill:#9ED8F5;}
.floormap #main .st26{fill:#00B8EE;}
.floormap #main .st27{fill:#E95504;}
.floormap #main .st28{fill:#F7C097;}
.floormap #main .st29{fill:#F08B4C;}
.floormap #main .st30{fill:none;stroke:#231815;stroke-miterlimit:10;}
.floormap #main .st31{fill:#E3007F;}
.floormap #main .st32{fill:#007D4F;}
.floormap #main .st33{fill:#66BE96;}
.floormap #main .st34{fill:#86C9AB;}
.floormap #main .st35{fill:#B94100;}
.floormap #main .st36{fill:#F4AE7D;}
.floormap #main .st37{fill:#4FB1C6;}
.floormap #main .st38{fill:#7DCCF3;}
.floormap #main .st39{fill:#E0969D;}
.floormap #main .st40{fill:#F9C04B;}
.floormap #main .st41{fill:#0081BA;}



.floormap #main .separator {}

@media only screen and (min-width: 401px){
.floormap #main .separator {
display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex;
-webkit-flex-wrap: wrap; -ms-flex-wrap: wrap; flex-wrap: wrap; 
-webkit-box-pack: justify;	-webkit-justify-content: space-between;	-ms-flex-pack: justify;	justify-content: space-between;
}
}

@media only screen and (max-width: 400px){
.floormap #main .separator {
}
}

.floormap #main .separator .item {
border-radius: 10px;
}

.floormap #main .separator .item.area01 {
background-color:#E5F2EC;
}

.floormap #main .separator .item.area02 {
background-color:#E8F4DC;
}

.floormap #main .separator .item.area03 {
background-color:#FBEFE5;
}

.floormap #main .separator .item.area04 {
background-color:#E6F4FA;
}

@media only screen and (min-width: 851px){
.floormap #main .separator .item {
width: calc((100% - 2rem) / 4);
padding: 2rem 2rem;
}
}

@media only screen and (min-width: 481px) and (max-width: 850px){
.floormap #main .separator .item {
width: calc((100% - 1rem) / 2);
padding: 2rem 2rem;
margin-bottom: 2rem;
}
}

@media only screen and (min-width: 401px) and (max-width: 480px){
.floormap #main .separator .item {
width: calc((100% - 1rem) / 2);
padding: .5rem .5rem 1.5rem;
margin-bottom: 1.5rem;
}
}

@media only screen and (max-width: 400px){
.floormap #main .separator .item {
width: 100%;
padding: 1.5rem 1.5rem;
margin-bottom: 1.5rem;
}
}

.floormap #main .separator .item .item-ttl {
width: 100%;
padding-bottom: 1.3rem;
margin-bottom: 1.3rem;
text-align: center;
border-bottom: #66D2D8 solid 2px;
}

@media only screen and (min-width: 401px) and (max-width: 480px){
.floormap #main .separator .item .item-ttl {
padding-bottom: .9rem;
margin-bottom: .4rem;
}
}

.floormap #main .separator .item .item-ttl img {
width: auto;
}

@media only screen and (min-width: 701px){
.floormap #main .separator .item .item-ttl img {
max-height: 40px;
}
}

@media only screen and (min-width: 481px) and (max-width: 700px){
.floormap #main .separator .item .item-ttl img {
max-height: 35px;
}
}

@media only screen and (min-width: 401px) and (max-width: 480px){
.floormap #main .separator .item .item-ttl img {
max-height: 22px;
}
}

@media only screen and (max-width: 400px){
.floormap #main .separator .item .item-ttl img {
max-height: 30px;
}
}

.floormap #main .separator .item .item-shop {
width: 100%;
margin-bottom: 1rem;
text-align: center;
}

@media only screen and (min-width: 401px) and (max-width: 480px){
.floormap #main .separator .item .item-shop {
margin-bottom: .2rem;
}
}

.floormap #main .separator .item .item-shop p {}

.floormap #main .separator .item .item-shop p a {
color: #FFF;
background-color: #31A468;
border-radius: 7px;
width: 100%;
display: block;
line-height: 1.6;
padding: .2rem .3rem .4rem;
margin: 2rem auto 0;
}

@media only screen and (min-width: 1001px){
.floormap #main .separator .item .item-shop p a {
max-width: 12rem;
}
}

@media only screen and (min-width: 901px) and (max-width: 1000px){
.floormap #main .separator .item .item-shop p a {
max-width: 11rem;
}
}

@media only screen and (max-width: 900px){
.floormap #main .separator .item .item-shop p a {
width: 100%;
}
}

.floormap #main .separator .item .item-shop p a:hover {
opacity: .8;
}

.floormap #main .separator .item .item-shop p a::after {
content:"\f105";
font-family: 'FontAwesome';
line-height: 1;
margin-left: .7rem;
text-transform: none;
display: inline-block;
}

.floormap #main .separator .item .item-shop img {
width: 100%;
}

@media only screen and (min-width: 701px){
.floormap #main .separator .item .item-shop img {
max-width: 170px;
}
}

@media only screen and (min-width: 481px) and (max-width: 700px){
.floormap #main .separator .item .item-shop img {
max-width: 120px;
}
}

@media only screen and (min-width: 401px) and (max-width: 480px){
.floormap #main .separator .item .item-shop img {
max-width: 100px;
}
}

@media only screen and (max-width: 400px){
.floormap #main .separator .item .item-shop img {
max-width: 140px;
}
}


/*************************************************************************************
**************************************************************************************

area_sapla

**************************************************************************************
**************************************************************************************/

.area_sapla {}

.area_sapla #main {}

@media only screen and (min-width: 701px){
.area_sapla #main {
padding-bottom: 3rem;
}
}

@media only screen and (min-width: 481px) and (max-width: 700px){
.area_sapla #main {
padding-bottom: 2rem;
}
}

@media only screen and (max-width: 480px){
.area_sapla #main {
padding-bottom: 1.5rem;
}
}

.area_sapla a:hover polygon,
.area_sapla a:hover path,
.area_sapla a:hover polyline,
.area_sapla a:hover rect {
opacity: 0.9;
-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=90)";
fill: #333;
}

/*SVG*/
#sapla_map a:hover,
#sapla_map02 a:hover {
opacity: 0.9;
-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=90)";
fill: #333;
}

/*floor1*/
/*
.area_sapla #main .st0{fill:#E6E6E6;}
.area_sapla #main .st1{fill:#DB5310;}
.area_sapla #main .st2{fill:#F8DFCB;}
.area_sapla #main .st3{fill:#F7B52C;}
.area_sapla #main .st4{fill:#FDF1DA;}
.area_sapla #main .st5{fill:#FFFFFF;}
.area_sapla #main .st6{fill:#E6242B;}
.area_sapla #main .st7{fill:#009FE3;}
.area_sapla #main .st8{fill:#CCF0F2;}
.area_sapla #main .st9{fill:#D85272;}
.area_sapla #main .st10{fill:#F7E1E3;}
.area_sapla #main .st11{fill:#1B94D3;}
.area_sapla #main .st12{fill:#DEE9F6;}
.area_sapla #main .st13{fill:#6CAF30;}
.area_sapla #main .st14{fill:#CCDFAD;}
.area_sapla #main .st15{fill:#F1BE97;}
.area_sapla #main .st16{fill:none;stroke:#000000;stroke-width:0.75;stroke-miterlimit:10;}
.area_sapla #main .st17{fill:#ADD1E9;}
.area_sapla #main .st18{fill:#999999;}
.area_sapla #main .st19{fill:none;stroke:#B3B3B3;stroke-width:4;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;}
.area_sapla #main .st20{fill:#00B4BE;}
*/

/*floor1*/
/*
.area_sapla #main .st0{fill:#E6E6E6;}
.area_sapla #main .st1{fill:#DB5310;}
.area_sapla #main .st2{fill:#F8DFCB;}
.area_sapla #main .st3{font-family:'NotoSansCJKjp-Regular-83pv-RKSJ-H';}
.area_sapla #main .st4{font-size:12px;glyph-orientation-vertical:0;writing-mode:tb;}
.area_sapla #main .st5{font-size:16px;}
.area_sapla #main .st6{fill:#F7B52C;}
.area_sapla #main .st7{fill:#FDF1DA;}
.area_sapla #main .st8{fill:#FFFFFF;}
.area_sapla #main .st9{fill:#E6242B;}
.area_sapla #main .st10{fill:#009FE3;}
.area_sapla #main .st11{fill:#CCF0F2;}
.area_sapla #main .st12{fill:#D85272;}
.area_sapla #main .st13{fill:#F7E1E3;}
.area_sapla #main .st14{fill:#1B94D3;}
.area_sapla #main .st15{fill:#DEE9F6;}
.area_sapla #main .st16{fill:#6CAF30;}
.area_sapla #main .st17{fill:#CCDFAD;}
.area_sapla #main .st18{letter-spacing:-3.3;}
.area_sapla #main .st19{fill:none;stroke:#000000;stroke-width:0.75;stroke-miterlimit:10;}
.area_sapla #main .st20{fill:none;stroke:#DB5310;stroke-miterlimit:10;}
.area_sapla #main .st21{fill:#ADD1E9;}
.area_sapla #main .st22{font-family:'NotoSansCJKjp-Medium-83pv-RKSJ-H';}
.area_sapla #main .st23{font-size:21.3333px;}
.area_sapla #main .st24{fill:#999999;}
.area_sapla #main .st25{fill:#00B4BE;}
.area_sapla #main .st26{fill:none;stroke:#B3B3B3;stroke-width:4;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;}
*/

/*floor1*/
.area_sapla #main .st0{fill:#E6E6E6;}
.area_sapla #main .st1{fill:#F7B52C;}
.area_sapla #main .st2{fill:#FDF1DA;}
.area_sapla #main .st3{fill:#FFFFFF;}
.area_sapla #main .st4{fill:#E6242B;}
.area_sapla #main .st5{fill:#009FE3;}
.area_sapla #main .st6{fill:#DB5310;}
.area_sapla #main .st7{fill:#F8DFCB;}
.area_sapla #main .st8{font-family:'NotoSansCJKjp-Regular-83pv-RKSJ-H';}
.area_sapla #main .st9{font-size:16px;}
.area_sapla #main .st10{fill:#CCF0F2;}
.area_sapla #main .st11{fill:#D85272;}
.area_sapla #main .st12{fill:#F7E1E3;}
.area_sapla #main .st13{fill:#1B94D3;}
.area_sapla #main .st14{fill:#DEE9F6;}
.area_sapla #main .st15{fill:#6CAF30;}
.area_sapla #main .st16{fill:#CCDFAD;}
.area_sapla #main .st17{letter-spacing:-3.3;}
.area_sapla #main .st18{fill:none;stroke:#000000;stroke-width:0.75;stroke-miterlimit:10;}
.area_sapla #main .st19{fill:#ADD1E9;}
.area_sapla #main .st20{font-family:'NotoSansCJKjp-Medium-83pv-RKSJ-H';}
.area_sapla #main .st21{font-size:21.3333px;}
.area_sapla #main .st22{fill:#999999;}
.area_sapla #main .st23{font-size:16px;glyph-orientation-vertical:0;writing-mode:tb;}
.area_sapla #main .st24{fill:#F1BE97;}
.area_sapla #main .st25{fill:#00B4BE;}
.area_sapla #main .st26{fill:none;stroke:#B3B3B3;stroke-width:4;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;}
.area_sapla #main .st27{font-size:19px;}

.area_sapla #main .st28{fill:#ECDCD4;}
.area_sapla #main .st29{fill:#A05027;}






/*floor2*/
.area_sapla #main .st42{fill:#E6E6E6;}
.area_sapla #main .st43{fill:#FFFFFF;}
.area_sapla #main .st44{fill:#D85272;}
.area_sapla #main .st45{fill:#1B94D3;}
.area_sapla #main .st46{fill:#DEE9F6;}
.area_sapla #main .st47{fill:#F7E1E3;}
.area_sapla #main .st48{fill:#F7B52C;}
.area_sapla #main .st49{fill:#FDF1DA;}
.area_sapla #main .st50{fill:#E6242B;}
.area_sapla #main .st51{fill:#009FE3;}
.area_sapla #main .st52{fill:#6CAF30;}
.area_sapla #main .st53{fill:#CCDFAD;}
.area_sapla #main .st54{font-family:'NotoSansCJKjp-Regular-83pv-RKSJ-H';}
.area_sapla #main .st55{font-size:12px;}
.area_sapla #main .st56{fill:#00B4BE;}
.area_sapla #main .st57{fill:none;stroke:#B3B3B3;stroke-width:4;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;}


.area_sapla #main .floor_ttl {
background-color: #F2F2F2;
position: relative;
font-weight: 700;
padding: .5rem 1rem .5rem 2rem;
}

@media only screen and (min-width: 701px){
.area_sapla #main .floor_ttl {
margin: 3rem 0 1.5rem;
}
}

@media only screen and (min-width: 481px) and (max-width: 700px){
.area_sapla #main .floor_ttl {
margin: 2rem 0 1.5rem;
}
}

@media only screen and (max-width: 480px){
.area_sapla #main .floor_ttl {
margin: 1.5rem 0 1rem;
}
}

.area_sapla #main .floor_ttl::before {
content: "";
background-color:#E95405;
display: inline-block;
position: absolute;
left: 1rem;
top: 50%;
transform: translateY(-50%);
height: 60%;
width: 4px;
border-radius: 50px;
line-height: 1;
}

.area_sapla #main .floor_ttl {
margin: 1.5rem 0 1rem;
}

.area_sapla #main .separator {
display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex;
-webkit-flex-wrap: wrap; -ms-flex-wrap: wrap; flex-wrap: wrap; 
-webkit-box-pack: justify;	-webkit-justify-content: space-between;	-ms-flex-pack: justify;	justify-content: space-between;
}

.area_sapla #main .separator .item {
display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex;
-webkit-box-pack: justify;	-webkit-justify-content: space-between;	-ms-flex-pack: justify;	justify-content: space-between;
margin-bottom: .5rem;
padding-bottom: .7rem;

background-image: linear-gradient(to right, #999, #999 1px, transparent 1px, transparent 2px);
background-position: left bottom;
background-repeat: repeat-x;
background-size: 4px 1px;
}

@media only screen and ( min-width : 701px ) {
.area_sapla #main .separator .item {
width: calc((100% - 2rem) / 2);
}
}

@media only screen and ( max-width : 700px ) {
.area_sapla #main .separator .item {
width: 100%;
}
}

.area_sapla #main .separator .item .shop_genre {}

.area_sapla #main .separator .item .shop_genre.gourmet {
color:#E95405;
}

.area_sapla #main .separator .item .shop_genre.fashion {
color:#E85377;
}

.area_sapla #main .separator .item .shop_genre.service {
color:#369FE8;
}

.area_sapla #main .separator .item .shop_genre.nicknack {
color:#6FB92D;
}

.area_sapla #main .separator .item .shop_genre.groceries {
color:#A05027;
}


/*************************************************************************************
**************************************************************************************

result

**************************************************************************************
**************************************************************************************/

.result {}

.result #main {}

@media only screen and (min-width: 701px){
.result #main {
padding: 2rem 0;
}
}

@media only screen and (min-width: 481px) and (max-width: 700px){
.result #main {
padding: 2rem 0;
}
}

@media only screen and (max-width: 480px){
.result #main {
padding: 1.5rem 0;
}
}

.result #main ul {}

.result #main ul li {}

.result #main ul li.item {
margin-bottom: 1.5rem;
padding-bottom: 1.5rem;
border-bottom: #DDD solid 2px;
}

@media only screen and (min-width: 701px){
.result #main ul li.item {
display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex;
-webkit-box-align: center;	-webkit-align-items: center;	-ms-flex-align: center;	align-items: center;
}
}

@media only screen and (min-width: 381px) and (max-width: 700px){
.result #main ul li.item {
display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex;
-webkit-box-align: center;	-webkit-align-items: center;	-ms-flex-align: center;	align-items: center;
}
}

@media only screen and (max-width: 380px){
.result #main ul li.item {
display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex;
-webkit-box-align: center;	-webkit-align-items: center;	-ms-flex-align: center;	align-items: center;
}
}

.result #main ul li.item .photo {}

@media only screen and (min-width: 701px){
.result #main ul li.item .photo {
width: 7rem;
}
}

@media only screen and (min-width: 481px) and (max-width: 700px){
.result #main ul li.item .photo {
width: 9rem;
}
}

@media only screen and (max-width: 480px){
.result #main ul li.item .photo {
width: 6rem;
}
}

.result #main ul li.item .text {}

@media only screen and (min-width: 701px){
.result #main ul li.item .text {
width: calc(100% - 8.5rem);
margin-left: 1.5rem;
}
}

@media only screen and (min-width: 481px) and (max-width: 700px){
.result #main ul li.item .text {
width: calc(100% - 10rem);
margin-left: 1rem;
}
}

@media only screen and (max-width: 480px){
.result #main ul li.item .text {
width: calc(100% - 7rem);
margin-left: 1rem;
}
}

.result #main ul li.item .text .item-ttl {
color: #39B4BE;
font-weight: 700;
}

@media only screen and (min-width: 701px){
.result #main ul li.item .text .item-ttl {
font-size: 1.1rem;
}
}

@media only screen and (min-width: 481px) and (max-width: 700px){
.result #main ul li.item .text .item-ttl {
font-size: 1.3rem;
}
}

@media only screen and (max-width: 480px){
.result #main ul li.item .text .item-ttl {
font-size: 1.0rem;
}
}

.result #main .ttb {
margin-bottom: 1.5rem;
}

.result #main .ttb + p {
margin-bottom: 1.0rem;
}


/*************************************************************************************
**************************************************************************************

shop_news

**************************************************************************************
**************************************************************************************/

.shop_news {}

.shop_news #main {}

@media only screen  and (min-width: 851px){
.shop_news #main {
/*max-width: 70%;*/
width:65%;
padding: 0 0 2rem;
}
}

@media only screen  and (min-width: 481px) and (max-width: 850px){
.shop_news #main {
padding: 0 0 2rem;
}
}

@media only screen  and (max-width: 480px){
.shop_news #main {
padding: 0 0 1.5rem;
}
}

/*ttb*/
.shop_news #main .ttb {}

@media only screen  and (min-width: 1151px){
.shop_news #main .ttb {
margin: 0 0 2rem;
}
}

@media only screen  and (min-width: 701px)  and (max-width: 1150px){
.shop_news #main .ttb {
margin: 0 0 2rem;
}
}

@media only screen  and (min-width: 481px)  and (max-width: 700px){
.shop_news #main .ttb {
margin: 0 0 1.25rem;
}
}

@media only screen and (max-width: 480px){
.shop_news #main .ttb {
margin: 0 0 1rem;
}
}

.shop_news #main .separator {
display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex;
-webkit-flex-wrap: wrap; -ms-flex-wrap: wrap; flex-wrap: wrap; 
}

.shop_news #main .separator .item {
position: relative;
background-color: #FFF;
box-shadow: 0 1px 7px #c1c1c1;
border-radius: 5px;
}

@media only screen and (min-width: 701px){
.shop_news #main .separator .item {
width: calc((100% - 2rem) / 3);
margin: 0 .99rem 1.5rem 0;
padding: .7rem .7rem;
}

.shop_news #main .separator .item:nth-of-type(3n) {
margin: 0 0 1.5rem 0;
}
}

@media only screen and (min-width: 401px) and (max-width: 700px){
.shop_news #main .separator .item {
width: calc((100% - 1rem) / 2);
padding: 1rem 1rem;
}

.shop_news #main .separator .item:nth-of-type(odd) {
margin: 0 .49rem 1.5rem 0;
}

.shop_news #main .separator .item:nth-of-type(even) {
margin: 0 0 1.5rem .49rem;
}
}

@media only screen and (min-width: 401px) and (max-width: 480px){
.shop_news #main .separator .item {
padding: .8rem .8rem;
}
}

@media only screen and (max-width: 400px){
.shop_news #main .separator .item {
width: calc((100% - 1rem) / 2);
padding: .9rem .9rem;
}

.shop_news #main .separator .item:nth-of-type(odd) {
margin: 0 .49rem 1.5rem 0;
}

.shop_news #main .separator .item:nth-of-type(even) {
margin: 0 0 1.5rem .49rem;
}
}

.shop_news #main .separator .item .photo {
padding-top: 60%;
overflow: hidden;
position: relative;
}

.shop_news #main .separator .item .photo img {
position: absolute; top: 0; left: 0;
width: 100%; height: auto;
}

@media only screen and (min-width: 701px) {
.shop_news #main .separator .item .photo {
margin: 0 0 .3rem;
}
}

@media only screen and (min-width: 401px) and (max-width: 700px){
.shop_news #main .separator .item .photo {
margin: 0 0 .7rem;
}
}

@media only screen and (max-width: 400px){
.shop_news #main .separator .item .photo {
margin: 0 0 .7rem;
}
}

.shop_news #main .separator .item .date {
text-align: right;
position: absolute;
}

@media only screen and (min-width: 701px) {
.shop_news #main .separator .item .date {
font-size: .7rem;
right: .7rem;
bottom: .7rem;
}
}

@media only screen and (min-width: 481px) and (max-width: 700px){
.shop_news #main .separator .item .date {
font-size: 1rem;
right: .7rem;
bottom: .7rem;
}
}

@media only screen and (min-width: 401px) and (max-width: 480px){
.shop_news #main .separator .item .date {
font-size: .8rem;
right: .7rem;
bottom: .7rem;
}
}

@media only screen and (max-width: 400px){
.shop_news #main .separator .item .date {
font-size: .9rem;
right: .7rem;
bottom: .7rem;
}
}

.shop_news #main .separator .item .item-ttl {
font-size: .9rem;
letter-spacing: .1em;
line-height: 1.6;
}

@media only screen and (min-width: 701px) {
.shop_news #main .separator .item .item-ttl {
font-size: .9rem;
margin: 0 0 1.7rem;
}
}

@media only screen and (min-width: 551px) and (max-width: 700px){
.shop_news #main .separator .item .item-ttl {
font-size: 1.2rem;
margin: 0 0 2.5rem;
}
}

@media only screen and (min-width: 481px) and (max-width: 550px){
.shop_news #main .separator .item .item-ttl {
font-size: 1.2rem;
margin: 0 0 2rem;
}
}

@media only screen and (min-width: 401px) and (max-width: 480px){
.shop_news #main .separator .item .item-ttl {
font-size: .9rem;
margin: 0 0 1.7rem;
}
}

@media only screen and (max-width: 400px){
.shop_news #main .separator .item .item-ttl {
font-size: 1rem;
margin: 0 0 1.7rem;
}
}

.shop_news #main .separator .item .ribbonArea {
position: absolute;
left: -4px; top: -5px;
z-index: 10;
}

.shop_news #main .separator .item .ribbon {
position:relative;
text-align: center;
width: auto;
max-width: 200px;
padding: 0 0 0 10px;
background-color:#E85377;
color: #FFF;
height: 20px;
line-height: 18px;
}

@media only screen and (min-width: 701px){
.shop_news #main .separator .item .ribbon {
font-size: .7rem;
}
}

@media only screen and (min-width: 481px) and (max-width: 700px){
.shop_news #main .separator .item .ribbon {
font-size: 1rem;
}
}

@media only screen and (max-width: 480px){
.shop_news #main .separator .item .ribbon {
font-size: .9rem;
}
}

.shop_news #main .separator .item .ribbon:before{  
content:' ';  
position:absolute;  
left:0px;  
bottom:-4px;  
border-top:2px solid #666;  
border-right:2px solid #666;  
border-bottom:2px solid transparent;  
border-left:2px solid transparent; 
z-index: -1;
}  

.shop_news #main .separator .item .ribbon:after{  
content:' ';  
position:absolute;  
right:-20px;  
top:0;  
border-bottom:10px solid transparent;  
border-left:10px solid #E85377;  
border-top:10px solid #E85377;  
border-right:10px solid transparent;  
z-index: 1;
}  

.shop_news #main .separator .item .text .tag_area {
margin: .9rem 0 .3rem;
border: #333 solid 1px;
padding: .2rem .5rem;
line-height: 1;
display: inline-block;
border-radius: 50px;
border-color:#2D9A63;
color: #2D9A63;
}

@media only screen and (min-width: 701px) {
.shop_news #main .separator .item .text .tag_area {
font-size: .7rem;
}
}

@media only screen and (min-width: 481px) and (max-width: 700px){
.shop_news #main .separator .item .text .tag_area {
font-size: 1rem;
}
}

@media only screen and (max-width: 480px){
.shop_news #main .separator .item .text .tag_area {
font-size: .7rem;
}
}


/*************************************************************************************
**************************************************************************************

access

**************************************************************************************
**************************************************************************************/

.access {}

.access #main {}

@media only screen and (min-width: 701px){
.access #main {
padding: 2.5rem 0;
}
}

@media only screen and (min-width: 481px) and (max-width: 700px){
.access #main {
padding: 2rem 0;
}
}

@media only screen and (max-width: 480px){
.access #main {
padding: 1.5rem 0;
}
}

.access #main img {
width: 100%;
image-rendering: -webkit-optimize-contrast;
}

/******************************

ggmap

*******************************/

.access #main .ggmap {
width: 100%;
overflow: hidden;
}

@media only screen and (min-width: 1101px){
.access #main .ggmap {
height: 400px;
margin-bottom: 2rem;
}
}

@media only screen and (max-width: 1100px){
.access #main .ggmap {
height: 350px;
margin-bottom: 2rem;
}
}

.access #main .ggmap iframe {
width: 100%;
}

@media only screen and (min-width: 1101px){
.access #main .ggmap iframe {
height: 700px;
margin-top: -150px;
}
}

@media only screen and (max-width: 1100px){
.access #main .ggmap iframe {
height: 650px;
margin-top: -150px;
}
}

/******************************

btn

*******************************/

.access #main .btn {}  

@media only screen  and (min-width: 701px){
.access #main .btn {
max-width: 15.5rem;
}  
}

@media only screen  and (min-width: 551px)  and (max-width: 700px){
.access #main .btn {
max-width: 18rem;
}  
}

@media only screen  and (min-width: 481px)  and (max-width: 550px){
.access #main .btn {
max-width: 19rem;
}  
}

@media only screen  and (min-width: 401px)  and (max-width: 480px){
.access #main .btn {
max-width: 16rem;
}  
}

@media only screen and (max-width: 400px){
.access #main .btn {
max-width: 18rem;
}  
}

/******************************

block-ttl

*******************************/

.access #main .block-ttl {
border-bottom: 2px solid #39B4BE;
padding-bottom: .5rem;
margin-bottom: 2rem;
font-weight: 700;
background-repeat: no-repeat;
background-size: auto 3rem;
padding-left: 3.7rem;
font-size: 1.2rem;
}

/******************************

block

*******************************/

.page.access #main .block {}

@media only screen  and (min-width: 1151px){
.page.access #main .block {
padding: 0 0 2rem;
}
}

@media only screen  and (min-width: 701px)  and (max-width: 1150px){
.page.access #main .block {
padding: 0 0 2rem;
}
}

@media only screen  and (min-width: 481px)  and (max-width: 700px){
.page.access #main .block {
padding: 0 0 2rem;
}
}

@media only screen and (max-width: 480px){
.page.access #main .block {
padding: 0 0 2rem;
}
}

/******************************

section01

*******************************/

.access #main .section01 {}


/******************************

section02

*******************************/

.access #main .section02 {}

.access #main .section02 .block-ttl {
background-image: url(../images/access_section02_ttl_bg.png);
background-position: left top -0.3rem;
}

@media only screen and (max-width: 480px){
.access #main .section02 .block-ttl {
background-size: auto 2.8rem;
}  
}

.access #main .section02 .box {
width: 100%;
}

.access #main .section02 .box .photo {}

@media only screen and (min-width : 1101px){
.access #main .section02 .box .photo {
width: 25rem;
margin-bottom: .5rem;
}
}

@media only screen and (min-width : 701px) and (max-width : 1100px){
.access #main .section02 .box .photo {
width: 22rem;
margin-bottom: .5rem;
}
}

@media only screen and (min-width : 701px){
.access #main .section02 .box .photo {
float: right;
padding-left: 1rem;
}

.access #main .section02 .box:after {
content: '';
display: block;
clear: both;
}

.access #main .section02 .box {
zoom: 1; /* for IE */
}
}

@media only screen and (max-width : 700px){
.access #main .section02 .box .photo {
width: 100%;
margin-bottom: .5rem;
}
}

/******************************

section03

*******************************/

.access #main .section03 {}

.access #main .section03 .block-ttl {
background-image: url(../images/access_section03_ttl_bg.png);
background-position: left top 0;
}

@media only screen and (max-width: 480px){
.access #main .section03 .block-ttl {
background-size: auto 2.5rem;
padding-left: 3rem;
background-position: left top .15rem;
}  
}

/******************************

section04

*******************************/

.access #main .section04 {}

.access #main .section04 .block-ttl {
background-image: url(../images/access_section04_ttl_bg.png);
background-position: left top -0.3rem;
}

@media only screen and (max-width: 480px){
.access #main .section04 .block-ttl {
background-size: auto 2.5rem;
padding-left: 3rem;
background-position: left top 0;
}  
}

.access #main .section04 .list_table,
.access #main .section04 .list_table > dt,
.access #main .section04 .list_table > dd {
box-sizing: border-box;
}

@media print, (min-width: 701px) {
.access #main .section04 .list_table {
display: flex;
flex-wrap: wrap;
}

.access #main .section04 .list_table > dt,
.access #main .section04 .list_table > dd {
display: flex;
flex-direction: column;
justify-content: center;
border-bottom: 1px solid #ddd;
padding: 1em;
margin: 0px;
}

.access #main .section04 .list_table > dt {
width: 30%;
background-color:transparent;
color:#39B4BE;
}

.access #main .section04 .list_table > dd {
width: 70%;
background-color: #fff;
}
}

@media screen and (max-width: 700px) {
.access #main .section04 .list_table > dt,
.access #main .section04 .list_table > dd {
padding: .7rem 1rem;
margin: 0px;
}

.access #main .section04 .list_table > dd {
border: 1px solid #ddd;
border-top: none;
}

.access #main .section04 .list_table > dt {
text-align: center;
background-color:#39B4BE;
color: #FFF;
}

.access #main .section04 .list_table > dd > ul {
text-align: left;
}
}

.access #main .section04 .list_table > dd > span {
display: block;
text-align: right;
margin-top: .5rem;
}


/*************************************************************************************
**************************************************************************************

pointcard

**************************************************************************************
**************************************************************************************/

.pointcard {}

.pointcard #main {}

@media only screen and (min-width: 701px){
.pointcard #main {
padding: 3rem 0;
}
}

@media only screen and (min-width: 481px) and (max-width: 700px){
.pointcard #main {
padding: 3.5rem 0 3rem;
}
}

@media only screen and (max-width: 480px){
.pointcard #main {
padding: 2.8rem 0 2.5rem;
}
}

.pointcard #main img {
width: 100%;
image-rendering: -webkit-optimize-contrast;
}

.page.pointcard #main .block {
padding: 0;
}

/******************************

section01

*******************************/

.pointcard #main .section01 {}

@media only screen  and (min-width: 481px){
.page.pointcard #main .section01.block {
padding: 0 0 3.5rem;
}
}

@media only screen and (max-width: 480px){
.pointcard #main .section01.block {
padding: 0 0 2.5rem;
}
}

.pointcard #main .section01 figure {
text-align: center;
}

.pointcard #main .section01 figure img {
/* box-shadow */
box-shadow: 0px 8px 16px -2px rgba(10,10,10,0.1), 0px 0px 0px 1px rgba(10,10,10,0.02);
border-radius: 20px;
}

@media only screen and (min-width: 701px){
.pointcard #main .section01 figure img {
width: 450px;
margin: 0 auto;
}
}

@media only screen and (min-width: 481px) and (max-width: 700px){
.pointcard #main .section01 figure img {
max-width:450px;
width: 80%;
margin: 0 auto;
}
}

@media only screen and (max-width: 480px){
.pointcard #main .section01 figure img {
width: 80%;
}
}

/******************************

table

*******************************/

.pointcard #main .table_outer {
width: 100%; overflow: auto;
}

.pointcard #main .table_outer::-webkit-scrollbar{
height: 5px; /* スクロールバーの高さ */
}
.pointcard #main .table_outer::-webkit-scrollbar-track{
background: #F1F1F1; /* スクロールバーの背景色 */
}
.pointcard #main .table_outer::-webkit-scrollbar-thumb {
background: #d6d6d6; /* スクロールバーの色 */
}

.pointcard #main .table_outer table {
width:100%;
border-left: #DDD solid 1px;
border-top: #DDD solid 1px;
}

@media only screen and (min-width: 1101px) {
.pointcard #main .table_outer table {
table-layout: fixed;
}
}

.pointcard #main .table_outer table th { 
display:table-cell; 
font-weight:700; 
vertical-align: middle;
border-right: #DDD solid 1px;
border-bottom: #DDD solid 1px;
background-color: #F5FCFC;
color: #39B4BE;
text-align: left;
}

@media only screen and (min-width: 701px) {
.pointcard #main .table_outer table th {
width: 200px;
padding:.7rem .7rem .7rem 1.5rem;
}
}

@media only screen and (min-width: 601px) and (max-width: 700px){
.pointcard #main .table_outer table th {
width: 200px;
padding:.7rem .7rem .7rem 1.5rem;
}
}

@media only screen and (max-width: 600px){
.pointcard #main .table_outer table th {
display: list-item;
width: 100%;
padding:.7rem 1.5rem;
}
}

.pointcard #main .table_outer table td {
border-right: #DDD solid 1px;
border-bottom: #DDD solid 1px;
}

@media only screen and (min-width: 701px) {
.pointcard #main .table_outer table td {
padding:.8rem .8rem;
}
}

@media only screen and (min-width: 601px) and (max-width: 700px){
.pointcard #main .table_outer table td {
padding:.8rem .8rem;
}
}

@media only screen and (max-width: 600px){
.pointcard #main .table_outer table td {
display: list-item;
width: 100%;
padding:.7rem 1.5rem;
}
}


/******************************

section02

*******************************/

.pointcard #main .section02 {}

@media only screen  and (min-width: 481px){
.page.pointcard #main .section02.block {
padding: 0 0 3.5rem;
}
}

@media only screen and (max-width: 480px){
.pointcard #main .section02.block {
padding: 0 0 2.5rem;
}
}

.pointcard #main .section02 .box {
width: 100%;
}

@media only screen and (min-width : 1101px){
.pointcard #main .section02 .box {
margin-top: 2.5rem;
}
}

@media only screen and (max-width : 1100px){
.pointcard #main .section02 .box {
margin-top: 2rem;
}
}

.pointcard #main .section02 .box .photo {}

@media only screen and (min-width : 1101px){
.pointcard #main .section02 .box .photo {
width: 27rem;
margin-bottom: .5rem;
}
}

@media only screen and (min-width : 701px) and (max-width : 1100px){
.pointcard #main .section02 .box .photo {
width: 25rem;
margin-bottom: .5rem;
}
}

@media only screen and (min-width : 701px){
.pointcard #main .section02 .box .photo {
float: right;
padding-left: 1rem;
}

.pointcard #main .section02 .box:after {
content: '';
display: block;
clear: both;
}

.pointcard #main .section02 .box {
zoom: 1; /* for IE */
}
}

@media only screen and (max-width : 700px){
.pointcard #main .section02 .box .photo {
width: 100%;
margin-bottom: 1.5rem;
}
}

.pointcard #main .section02 .table_outer {}

@media only screen and (min-width : 701px){
.pointcard #main .section02 .table_outer {
margin-top: 2rem;
}
}

@media only screen and (max-width : 700px){
.pointcard #main .section02 .table_outer {
margin-top: 1.5rem;
}
}

/******************************

section03

*******************************/

.pointcard #main .section03 {}

.pointcard #main .section03 .ttb {}

@media only screen and (min-width : 1101px){
.pointcard #main .section03 .ttb {
margin-bottom: 2.5rem;
}
}

@media only screen and (max-width : 1100px){
.pointcard #main .section03 .ttb {
margin-bottom: 2rem;
}
}

.pointcard #main .section03 .lead {
margin-bottom: 1rem;
}

.pointcard #main .section03 .lead ul {}

.pointcard #main .section03 .lead li {
list-style-position:inside;
list-style-type: square;
}

.pointcard #main .section03 .lead li span {
display: block;
background-color: #F5FCFC;
padding: 1rem 2rem;
margin: 1rem 0;
}

.pointcard #main .section03 .box {
counter-increment: box01;
margin-bottom:.8rem;
background-image: linear-gradient(to right, #63513b, #63513b 1px, transparent 1px, transparent 2px);
background-position: left bottom;
background-repeat: repeat-x;
background-size: 4px 1px;
padding-bottom: .8rem;
}

.pointcard #main .section03 .box:nth-last-of-type(1) {
margin-bottom:0;
background-image: none;
padding-bottom: 0;
}

.pointcard #main .section03 .box .box-ttl {
font-weight:bold; font-weight:700;
font-size: 1.1rem;
margin: 0 0 .5rem 0;
}

.pointcard #main .section03 .box .box-ttl::before {
content: "第" counter(box01) "条（";
margin-right: .5rem;
}

.pointcard #main .section03 .box .box-ttl::after {
content: " ）";
margin-right: .5rem;
}

.pointcard #main .section03 .box ol {
counter-reset: number 0;
}

.pointcard #main .section03 .box ol li {
letter-spacing: 0.1em;
position: relative;
}

.pointcard #main .section03 .box ol li::before {
counter-increment: number 1;
content: "(" counter(number) ")";
margin-right: .5rem;
}

.pointcard #main .section03 .box p {
}

.pointcard #main .section03 .box p.caution {
display: block;
border: red solid 1px;
color: red;
padding: 1rem 2rem;
margin: 1rem 0;
}


/*************************************************************************************
**************************************************************************************

policy

**************************************************************************************
**************************************************************************************/

.policy {}

.policy #main {}

@media only screen and (min-width: 701px){
.policy #main {
padding: 3rem 0 0;
}
}

@media only screen and (min-width: 481px) and (max-width: 700px){
.policy #main {
padding: 3.5rem 0 0;
}
}

@media only screen and (max-width: 480px){
.policy #main {
padding: 2.8rem 0 0;
}
}

.policy #main .inside {
width: 100%;
}

@media only screen  and (min-width: 1151px){
.page #main .inside {
padding: 0 0 1.5rem;
}
}

@media only screen  and (min-width: 701px)  and (max-width: 1150px){
.page #main .inside {
padding: 0 0 1.5rem;
}
}

@media only screen  and (min-width: 481px)  and (max-width: 700px){
.page #main .inside {
padding: 0 0 1.5rem;
}
}

@media only screen and (max-width: 480px){
.page #main .inside {
padding: 0 0 1.5rem;
}
}

.policy #main .block .ttb {}

@media only screen and (min-width : 1101px){
.policy #main .block .ttb {
margin-bottom: 2.5rem;
}
}

@media only screen and (max-width : 1100px){
.policy #main .block .ttb {
margin-bottom: 2rem;
}
}

.policy #main .block .ttb + p {}

@media only screen and (min-width : 1101px){
.policy #main .block .ttb + p {
margin-bottom: 2.5rem;
}
}

@media only screen and (max-width : 1100px){
.policy #main .block .ttb + p {
margin-bottom: 2rem;
}
}

.policy #main .box {
counter-increment: box02;
margin-bottom:.8rem;
background-image: linear-gradient(to right, #63513b, #63513b 1px, transparent 1px, transparent 2px);
background-position: left bottom;
background-repeat: repeat-x;
background-size: 4px 1px;
padding-bottom: .8rem;
}

.policy #main .box:nth-last-of-type(1) {
margin-bottom:0;
background-image: none;
padding-bottom: 0;
}

.policy #main .box .box-ttl {
font-weight:bold; font-weight:700;
font-size: 1.1rem;
margin: 0 0 .5rem 0;
}

.policy #main .box .box-ttl::before {
content: "(";
margin-right: .5rem;
}

.policy #main .box .box-ttl::after {
content: " ）";
margin-right: .5rem;
}

/*type01*/
.policy #main .box ol.type01 {}

.policy #main .box ol.type01 li {
letter-spacing: 0.1em;
position: relative;
}

.policy #main .box ol.type01 li::before {
content: "" counter(box02) ".";
margin-right: .5rem;
}

.policy #main .box ol.type01 li span.contact_address {
display: block;
background-color: #F5FCFC;
padding: 1rem 2rem;
margin: 1rem 0;
}

.policy #main .box .sign {
text-align: right;
}

/*type02*/
.policy #main .box ol.type02 {
counter-reset: box03 0;
}

.policy #main .box ol.type02 li {
letter-spacing: 0.1em;
position: relative;
}

.policy #main .box ol.type02 li::before {
counter-increment: box03 1;
content: "(" counter(box03) ")";
margin-right: .5rem;
}

/*wrapper*/
.policy #main .box .wrapper {
display: block;
background-color: #F5FCFC;
padding: 1.5rem 2rem;
margin: 1rem 0;
}

/*circle*/
.policy #main .box .circle {
counter-increment: box04;
margin-bottom:.8rem;
background-image: linear-gradient(to right, #63513b, #63513b 1px, transparent 1px, transparent 2px);
background-position: left bottom;
background-repeat: repeat-x;
background-size: 4px 1px;
padding-bottom: .8rem;
}

.policy #main .box .circle:nth-last-of-type(1) {
margin-bottom:0;
background-image: none;
padding-bottom: 0;
}

.policy #main .box .circle .circle-ttl {
font-weight:bold; font-weight:700;
font-size: 1.1rem;
margin: 0 0 .5rem 0;
}


.policy #main .box .circle .circle-ttl::before {
content: "(" counter(box04) ")";
margin-right: .5rem;
}


/*************************************************************************************
**************************************************************************************

area_guide

**************************************************************************************
**************************************************************************************/

.area_guide {}

.area_guide #main {}

@media only screen and (min-width: 701px){
.area_guide #main {
padding:2.5rem 0 1rem;
}
}

@media only screen and (min-width: 481px) and (max-width: 700px){
.area_guide #main {
padding:2rem 0 1rem;
}
}

@media only screen and (max-width: 480px){
.area_guide #main {
padding:2rem 0 1rem;
}
}

.area_guide #main .block {
padding: 0 0 2rem;
}

.area_guide #main .floor_ttl {
background-color: #F2F2F2;
position: relative;
font-weight: 700;
padding: .5rem 1rem .5rem 2rem;
}

@media only screen and (min-width: 701px){
.area_guide #main .floor_ttl {
margin: 0 0 1.5rem;
}
}

@media only screen and (min-width: 481px) and (max-width: 700px){
.area_guide #main .floor_ttl {
margin: 0 0 1.5rem;
}
}

@media only screen and (max-width: 480px){
.area_guide #main .floor_ttl {
margin: 1.5rem 0 1rem;
}
}

.area_guide #main .floor_ttl::before {
content: "";
background-color:#E95405;
display: inline-block;
position: absolute;
left: 1rem;
top: 50%;
transform: translateY(-50%);
height: 60%;
width: 4px;
border-radius: 50px;
line-height: 1;
}

.area_guide #main .floor_ttl {
margin: 0 0 1.5rem;
}

.area_guide #main .separator {
display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex;
-webkit-flex-wrap: wrap; -ms-flex-wrap: wrap; flex-wrap: wrap; 
-webkit-box-pack: justify;	-webkit-justify-content: space-between;	-ms-flex-pack: justify;	justify-content: space-between;
}

.area_guide #main .separator .item {
display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex;
-webkit-box-pack: justify;	-webkit-justify-content: space-between;	-ms-flex-pack: justify;	justify-content: space-between;
margin-bottom: .5rem;
padding-bottom: .7rem;

background-image: linear-gradient(to right, #999, #999 1px, transparent 1px, transparent 2px);
background-position: left bottom;
background-repeat: repeat-x;
background-size: 4px 1px;
}

@media only screen and ( min-width : 701px ) {
.area_guide #main .separator .item {
width: 100%;
}
}

@media only screen and ( max-width : 700px ) {
.area_guide #main .separator .item {
width: 100%;
}
}

.area_guide #main .separator .item .shop_genre {}

.area_guide #main .separator .item .shop_genre.gourmet {
color:#E95405;
}

.area_guide #main .separator .item .shop_genre.fashion {
color:#E85377;
}

.area_guide #main .separator .item .shop_genre.service {
color:#369FE8;
}

.area_guide #main .separator .item .shop_genre.nicknack {
color:#6FB92D;
}


/*************************************************************************************
**************************************************************************************

area

**************************************************************************************
**************************************************************************************/

.area {}

.area #main {}

@media only screen and (min-width: 701px){
.area #main {
padding:2.5rem 0 1rem;
}
}

@media only screen and (min-width: 481px) and (max-width: 700px){
.area #main {
padding:2rem 0 1rem;
}
}

@media only screen and (max-width: 480px){
.area #main {
padding:2rem 0 1rem;
}
}

.area #main .block {
padding: 0 0 2rem;
}

/******************************************
are_logo
*******************************************/

.area #main .are_logo {}

.area #main .are_logo {
margin-bottom: 2rem;
}

.area #main .are_logo img {
width: auto;
/*height: 4rem;*/
height:70px;
image-rendering: -webkit-optimize-contrast;
}

/******************************************
item
*******************************************/

.area #main .item {}

.area #main .item .unit {
margin-bottom: 2rem;
}

/******************************
unit01
*******************************/

.area #main .item .unit01 {
margin-top: 2rem;
}

.area #main .item .unit01 .separator {
display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex;
-webkit-flex-wrap: wrap; -ms-flex-wrap: wrap; flex-wrap: wrap; 
-webkit-box-align: center;	-webkit-align-items: center;	-ms-flex-align: center;	align-items: center;
margin-bottom: 2rem;
}

.area #main .item .unit01 .separator .photo {
width: 30rem;
}

@media only screen and ( min-width : 801px ) {
.area #main .item .unit01 .separator .photo {
width: 30rem;
}
}

@media only screen and ( min-width : 701px ) and ( max-width : 800px ) {
.area #main .item .unit01 .separator .photo {
width: 25rem;
}
}

@media only screen and ( max-width : 700px ) {
.area #main .item .unit01 .separator .photo {
width: 100%;
margin-bottom: 2rem;
}
}

.area #main .item .unit01 .separator .photo img {
width: 100%;
}

.area #main .item .unit01 .separator .text {
}

@media only screen and ( min-width : 801px ) {
.area #main .item .unit01 .separator .text {
width: calc(100% - 30rem);
padding-left: 2rem;
}

.area #main .item .unit01 .separator .text.w100 {
width: 100%;
padding-left: 0;
}
}

@media only screen and ( min-width : 701px ) and ( max-width : 800px ) {
.area #main .item .unit01 .separator .text {
width: calc(100% - 25rem);
padding-left: 1rem;
}

.area #main .item .unit01 .separator .text.w100 {
width: 100%;
padding-left: 0;
}

}

@media only screen and ( max-width : 700px ) {
.area #main .item .unit01 .separator .text {
width: 100%;
padding-bottom: 2rem;
}
}

.area #main .item .unit01 .separator .text .shoplogo {
width: 100%;
}

@media only screen and ( min-width : 801px ) {
.area #main .item .unit01 .separator .text .shoplogo {
max-width: 13rem;
margin: 0 auto 2rem;
}
}

@media only screen and ( min-width : 701px ) and ( max-width : 800px ) {
.area #main .item .unit01 .separator .text .shoplogo {
max-width: 13rem;
margin: 0 auto 2rem;
}
}

@media only screen and ( max-width : 700px ) {
.area #main .item .unit01 .separator .text .shoplogo {
max-width: 13rem;
margin: 0 auto 1.5rem;
}
}

.area #main .item .unit01 dl {
width: 100%;
}

.area #main .item .unit01 dt {}

@media only screen and (min-width: 481px){
.area #main .item .unit01 dt {
width: 20rem;
float: left;
clear: both;
}
}

@media only screen and (max-width: 480px){
.area #main .item .unit01 dt {
width: 100%;
}
}

.area #main .item .unit01 dt span {}


.area #main .item .unit01 dt span {
display: inline-block;
background-repeat: no-repeat;
background-position: left center;
}

@media screen and (min-width:481px) {
.area #main .item .unit01 dt span {
background-size: auto 1.5rem;
padding-left: 2.5rem;
min-height: 1.5rem;
}
}

@media screen and (max-width:480px) {
.area #main .item .unit01 dt span {
background-size: auto 1.2rem;
padding-left: 1.8rem;
min-height: 1.2rem;
}
}

.area #main .item .unit01 dt.icon_phone span {
background-image: url(../images/icon_phone.png);
}

.area #main .item .unit01 dt.icon_floor span {
background-image: url(../images/icon_floor.png);
}

.area #main .item .unit01 dt.icon_time span {
background-image: url(../images/icon_time.png);
}

.area #main .item .unit01 dt.icon_web span {
background-image: url(../images/icon_web.png);
}

.area #main .item .unit01 dd {}

@media only screen and (min-width: 481px){
.area #main .item .unit01 dd {
float: none;
padding-left: 15rem;
border-bottom: #DDD solid 1px;
padding: 0 0 1rem 15rem;
margin-bottom: 1rem;
}
}

@media only screen and (max-width: 480px){
.area #main .item .unit01 dd {
border-bottom: #DDD solid 1px;
padding: 0 0 1rem 0;
margin-bottom: 1rem;
}
}

.area #main .item .unit01 ::after {}

@media only screen and (min-width: 481px){
.area #main .item .unit01 ::after {
content: '';
display: block;
clear: both;
}
}

@media only screen and (max-width: 480px){
.area #main .item .unit01 ::after {
}
}


/******************************
unit02
*******************************/

.area #main .item .unit02 {
}

.area #main .item .unit02 .box {}

@media only screen and ( min-width : 481px ) {
.area #main .item .unit02 .box {
margin-top: 2rem;
}
}

@media only screen and ( max-width : 480px ) {
.area #main .item .unit02 .box {
margin-top: 2rem;
}
}

.area #main .item .unit02 .box .box-ttl {
padding: 0.2em 0 0.2em 0.5em;
margin-bottom: 1rem;
border-left: solid 5px #39B4BE;
}

@media only screen and (min-width: 701px){
.area #main .item .unit02 .box .box-ttl {
font-size: 1.1rem;
}
}

@media only screen and (min-width: 481px) and (max-width: 700px){
.area #main .item .unit02 .box .box-ttl {
font-size: 1.4rem;
}
}

@media only screen and (max-width: 480px){
.area #main .item .unit02 .box .box-ttl {
font-size: 1.0rem;
}
}

.area #main .item .unit02 .box .separator {
}

@media only screen and ( min-width : 481px ) {
.area #main .item .unit02 .box .separator {
display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex;
-webkit-flex-wrap: wrap; -ms-flex-wrap: wrap; flex-wrap: wrap; 
}

.area #main .item .unit02 .box:nth-of-type(odd) .separator {
-webkit-box-orient: horizontal;	-webkit-box-direction: normal;	-webkit-flex-direction: row;	-ms-flex-direction: row;	flex-direction: row;
}

.area #main .item .unit02 .box:nth-of-type(even) .separator {
-webkit-box-orient: horizontal;	-webkit-box-direction: reverse;	-webkit-flex-direction: row-reverse;	-ms-flex-direction: row-reverse;	flex-direction: row-reverse;
}
}

@media only screen and ( max-width : 480px ) {
.area #main .item .unit02 .box .separator {
}
}

.area #main .item .unit02 .separator .photo {}

@media only screen and ( min-width : 481px ) {
.area #main .item .unit02 .separator .photo {
width: 50%;
}
}

@media only screen and ( max-width : 480px ) {
.area #main .item .unit02 .separator .photo {
width: 100%;
margin-bottom: 1rem;
}
}

.area #main .item .unit02 .separator .photo img {
width: 100%;
border-radius: 10px;
}

.area #main .item .unit02 .box .separator .text {}

@media only screen and ( min-width : 481px ) {
.area #main .item .unit02 .box .separator .text {
width: calc(100% - 50%);
}

.area #main .item .unit02 .box:nth-of-type(odd) .separator .text {
padding-left: 2rem;
}

.area #main .item .unit02 .box:nth-of-type(even) .separator .text {
padding-right: 2rem;
}
}

@media only screen and ( max-width : 480px ) {
.area #main .item .unit02 .box .separator .text {
width: 100%;
}
}


/*************************************************************************************
**************************************************************************************

hall

**************************************************************************************
**************************************************************************************/

.hall {}

.hall #main {}

@media only screen and (min-width: 701px){
.hall #main {
padding: 2.5rem 0;
}
}

@media only screen and (min-width: 481px) and (max-width: 700px){
.hall #main {
padding: 2rem 0;
}
}

@media only screen and (max-width: 480px){
.hall #main {
padding: 1.5rem 0;
}
}

.hall #main img {
width: 100%;
image-rendering: -webkit-optimize-contrast;
}

/******************************

block

*******************************/

.page.hall #main .block {}

@media only screen  and (min-width: 1151px){
.page.hall #main .block {
padding: 0 0 2rem;
}
}

@media only screen  and (min-width: 701px)  and (max-width: 1150px){
.page.hall #main .block {
padding: 0 0 2rem;
}
}

@media only screen  and (min-width: 481px)  and (max-width: 700px){
.page.hall #main .block {
padding: 0 0 2rem;
}
}

@media only screen and (max-width: 480px){
.page.hall #main .block {
padding: 0 0 2rem;
}
}

/******************************

unit

*******************************/

.hall #main .unit {
/*padding: 0 0 2rem;*/
}

.hall #main .block .unit {
counter-increment: box01;
background-image: linear-gradient(to right, #63513b, #63513b 1px, transparent 1px, transparent 2px);
background-position: left bottom;
background-repeat: repeat-x;
background-size: 4px 1px;
padding-bottom: 1rem;
margin-bottom:1rem;
}

.hall #main .block .unit:nth-last-of-type(1) {
margin-bottom:0;
background-image: none;
padding-bottom: 0;
}

.hall #main .block:nth-last-of-type(1) .unit {
margin-bottom:0;
background-image: none;
padding: 0 0 2rem;
}


/******************************

ttl

*******************************/

.hall #main .ttb {}

@media only screen and (min-width : 1101px){
.hall #main .ttb {
margin-bottom: 1rem;
}
}

@media only screen and (max-width : 1100px){
.hall #main .ttb {
margin-bottom: 1.5rem;
}
}

.hall #main .pagetoptext {}

@media only screen and (min-width : 1101px){
.hall #main .pagetoptext {
margin-bottom: 1.5rem;
}
}

@media only screen and (max-width : 1100px){
.hall #main .pagetoptext {
margin-bottom: 2rem;
}
}

.hall #main .unit-ttl {
font-weight: bold;
color: #39B4BE;
}

.hall #main .unit-ttl {}

@media only screen and (min-width: 701px){
.hall #main .unit-ttl {
font-size: 1.1rem;
}
}

@media only screen and (min-width: 481px) and (max-width: 700px){
.hall #main .unit-ttl {
font-size: 1.25rem;
}
}

@media only screen and (max-width: 480px){
.hall #main .unit-ttl {
font-size: 1.0rem;
}
}

@media only screen and (min-width : 701px){
.hall #main .unit-ttl {
margin-bottom: .2rem;
}
}

@media only screen and (min-width : 481px) and (max-width : 700px){
.hall #main .unit-ttl {
margin-bottom: .4rem;
}
}

@media only screen and (max-width : 480px){
.hall #main .unit-ttl {
margin-bottom: .2rem;
}
}


.hall #main .unit-ttl::before {
content:"\f1db";
font-family: "FontAwesome";
line-height: 1;
margin-right: 5px;
text-transform: none;
}

/******************************

table

*******************************/

.hall #main .table_outer {
width: 100%; overflow: auto;
margin-top: .5rem;
}

.hall #main .table_outer::-webkit-scrollbar{
height: 5px; /* スクロールバーの高さ */
}
.hall #main .table_outer::-webkit-scrollbar-track{
background: #F1F1F1; /* スクロールバーの背景色 */
}
.hall #main .table_outer::-webkit-scrollbar-thumb {
background: #d6d6d6; /* スクロールバーの色 */
}

/*********************
typeA
**********************/

.hall #main .table_outer table.typeA {
width:100%;
border-left: #DDD solid 1px;
border-top: #DDD solid 1px;
}

@media only screen and (min-width: 1101px) {
.hall #main .table_outer table.typeA {
table-layout: fixed;
}
}

.hall #main .table_outer table.typeA th { 
display:table-cell; 
font-weight:700; 
vertical-align: middle;
border-right: #DDD solid 1px;
border-bottom: #DDD solid 1px;
background-color: #F5FCFC;
color: #39B4BE;
text-align: left;
}

@media only screen and (min-width: 701px) {
.hall #main .table_outer table.typeA th { 
width: 200px;
padding:.7rem .7rem .7rem 1.5rem;
}
}

@media only screen and (min-width: 601px) and (max-width: 700px){
.hall #main .table_outer table.typeA th { 
width: 200px;
padding:.7rem .7rem .7rem 1.5rem;
font-size: 1rem;
}
}

@media only screen and (max-width: 600px){
.hall #main .table_outer table.typeA th { 
display: list-item;
width: 100%;
padding:.7rem 1.5rem;
}
}

.hall #main .table_outer table.typeA td {
border-right: #DDD solid 1px;
border-bottom: #DDD solid 1px;
}

@media only screen and (min-width: 701px) {
.hall #main .table_outer table.typeA td {
padding:.8rem .8rem;
}
}

@media only screen and (min-width: 601px) and (max-width: 700px){
.hall #main .table_outer table.typeA td {
padding:.8rem .8rem;
font-size: 1rem;
}
}

@media only screen and (max-width: 600px){
.hall #main .table_outer table.typeA td {
display: list-item;
width: 100%;
padding:.7rem 1.5rem;
}
}

/*********************
typeB
**********************/

.hall #main .table_outer table.typeB {
width:100%;
border-left: #DDD solid 1px;
border-top: #DDD solid 1px;
}

@media only screen and (min-width: 1101px) {
.hall #main .table_outer table.typeB {
table-layout: fixed;
}
}

.hall #main .table_outer table.typeB th { 
display:table-cell; 
font-weight:700; 
vertical-align: middle;
border-right: #DDD solid 1px;
border-bottom: #DDD solid 1px;
background-color: #F5FCFC;
color: #39B4BE;
text-align: center;
line-height: 1.5;
}

@media only screen and (min-width: 701px) {
.hall #main .table_outer table.typeB th { 
width: 200px;
padding:.6rem;
}
}

@media only screen and (min-width: 601px) and (max-width: 700px){
.hall #main .table_outer table.typeB th { 
width: 200px;
padding:.6rem;
font-size: 1rem;
}
}

@media only screen and (max-width: 600px){
.hall #main .table_outer table.typeB th { 
display:table-cell;
min-width:150px;
padding:.7rem 1.5rem;
}
}

.hall #main .table_outer table.typeB td {
border-right: #DDD solid 1px;
border-bottom: #DDD solid 1px;
text-align: center;
}

@media only screen and (min-width: 701px) {
.hall #main .table_outer table.typeB td {
padding:.8rem .8rem;
}
}

@media only screen and (min-width: 601px) and (max-width: 700px){
.hall #main .table_outer table.typeB td {
padding:.8rem .8rem;
font-size: 1rem;
}
}

@media only screen and (max-width: 600px){
.hall #main .table_outer table.typeB td {
display:table-cell;
min-width:150px;
padding:.7rem 1.5rem;
}
}

.hall #main .table_outer + p {}

@media only screen and (min-width : 1101px){
.hall #main .table_outer + p {
margin-top: 1rem;
}
}

@media only screen and (max-width : 1100px){
.hall #main .table_outer + p {
margin-top: 1rem;
}
}

.hall #main ol.number {}

.hall #main ol.number li {
letter-spacing: 0.1em;
position: relative;
counter-increment: number01;
}

.hall #main ol.number li::before {
content: "(" counter(number01) ")";
margin-right: .5rem;
}

.hall #main .separator {}

@media only screen and (min-width : 501px){
.hall #main .separator {
display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex;
}
}

.hall #main .separator .photo {}

@media only screen and (min-width : 1001px){
.hall #main .separator .photo {
width: 155px;
}
}

@media only screen and (min-width : 701px) and (max-width : 1000px){
.hall #main .separator .photo {
width: 180px;
}
}


@media only screen and (min-width : 601px) and (max-width : 700px){
.hall #main .separator .photo {
width: 180px;
}
}

@media only screen and (min-width : 501px) and (max-width : 600px){
.hall #main .separator .photo {
width: 260px;
}
}

@media only screen and (min-width : 501px){
.hall #main .separator .photo {
padding-left: 20px;
}

.hall #main .separator:after {
content: '';
display: block;
clear: both;
}

.hall #main .separator {
zoom: 1; /* for IE */
}
}

@media only screen and (max-width : 500px){
.hall #main .separator .photo {
width: 100%;
margin-top:2rem;
}
}

.hall #main .separator .table_outer {}

@media only screen and (min-width : 1001px){
.hall #main .separator .table_outer {
width: calc(100% - 175px);
}
}

@media only screen and (min-width : 701px) and (max-width : 1000px){
.hall #main .separator .table_outer {
width: calc(100% - 200px);
}
}

@media only screen and (min-width : 601px) and (max-width : 700px){
.hall #main .separator .table_outer {
width: calc(100% - 200px);
}
}

@media only screen and (min-width : 501px) and (max-width :600px){
.hall #main .separator .table_outer {
width: calc(100% - 260px);
}
}

@media only screen and (max-width : 500px){
.hall #main .separator .table_outer {
width: 100%;
}
}

.hall #main .separator .table_outer table.typeA th {}

@media only screen and (min-width: 701px) {
.hall #main .separator .table_outer table.typeA th { 
max-width: 230px;
}
}

@media only screen and (min-width: 501px) and (max-width: 700px){
.hall #main .separator .table_outer table.typeA th { 
max-width: 100%;
}
}

@media only screen and (max-width: 500px){
.hall #main .separator .table_outer table.typeA th { 
display: list-item;
width: 100%;
padding:.7rem 1.5rem;
}
}

.hall #main .unit_inner {
display: block;
background-color: #F5FCFC;
padding: 1rem 2.5rem;
margin: 1rem 0 0;
}

.hall #main .unit_inner span {
font-weight: bold;
color: #39B4BE;
}

.hall #main .emphasis {
font-weight: bold;
color: #39B4BE;
}

/*btn*/
.hall #main .btn_wrapper {
display: flex;
justify-content: space-between;
gap: 1rem;
text-align: center;
margin-top: 1.3rem;
}

.hall #main .nextpage {
width: calc(50% - .5rem);
text-align: center;
display: flex;
}

.hall #main .nextpage a {
width: 100%;
margin: 0 auto;
border: 2px solid #39B4BE;
background-color:transparent;
display: flex;
padding: 0 1rem;
justify-content: center;
align-items: center;
text-decoration: none;
color: #39B4BE;
font-size: 110%;
border-radius: 8px;
flex-direction: column;
flex: 1 0 auto;
}

@media only screen  and (min-width: 801px){
.hall #main .nextpage a {
line-height: 1.5;
font-size: 1.1rem;
padding: 1rem .5rem;
}
}

@media only screen  and (min-width: 601px) and (max-width: 800px){
.hall #main .nextpage a {
line-height: 1.5;
font-size: 1.2rem;
padding: 1rem .5rem;
}
}

@media only screen  and (min-width: 481px) and (max-width: 600px){
.hall #main .nextpage a {
width: 100%;
padding: 1rem .5rem;
font-size: 1.2rem;
justify-content: center;
line-height: 1.5;
}
}

@media only screen and (max-width: 480px){
.hall #main .nextpage a {
width: 100%;
font-size: .95rem;
padding: .5rem .5rem;
justify-content: center;
line-height: 1.5;
}
}

.hall #main .nextpage a:hover {
border-color:#39B4BE;
background-color:#F5FCFC;
color: #39B4BE;
}

.hall #main .nextpage a span {
text-align: left;
}

.hall #main .nextpage a span::before {
content:"\f003";
font-family: "FontAwesome";
line-height: 1;
margin-right: 5px;
text-transform: none;
}

.hall #main .nextpage.pdf a span::before {
content:"\f1c1";
font-family: "FontAwesome";
line-height: 1;
margin-right: 5px;
text-transform: none;
}

.hall #main .hall_divider{
    display: flex;
    flex-wrap: wrap;
    margin-bottom: 1rem;
}

.hall #main .hall_divider .table_outer{
    width: calc(50% - 20px);
    margin-right: 20px;
}

.hall #main .hall_divider > p{
    width: 50%;
}

@media only screen  and (min-width: 601px) and (max-width: 800px){
    .hall #main .hall_divider {

    }
}

@media only screen  and (max-width: 600px){
    .hall #main .hall_divider {
        
    }
    .hall #main .hall_divider .table_outer{
        width: 100%;
        margin-right: 0;
    }
    .hall #main .hall_divider > p{
        width: 100%;
    }
}

@media only screen and (max-width: 480px){
    .hall #main .hall_divider {
    
    }
}


/*************************************************************************************
**************************************************************************************

hall_test

**************************************************************************************
**************************************************************************************/

.hall_test {}

.hall_test #main {}

@media only screen and (min-width: 701px){
.hall_test #main {
padding: 2.5rem 0;
}
}

@media only screen and (min-width: 481px) and (max-width: 700px){
.hall_test #main {
padding: 2rem 0;
}
}

@media only screen and (max-width: 480px){
.hall_test #main {
padding: 1.5rem 0;
}
}

.hall_test #main img {
width: 100%;
image-rendering: -webkit-optimize-contrast;
}

/******************************

block

*******************************/

.page.hall_test #main .block {}

@media only screen  and (min-width: 1151px){
.page.hall_test #main .block {
padding: 0 0 2rem;
}
}

@media only screen  and (min-width: 701px)  and (max-width: 1150px){
.page.hall_test #main .block {
padding: 0 0 2rem;
}
}

@media only screen  and (min-width: 481px)  and (max-width: 700px){
.page.hall_test #main .block {
padding: 0 0 2rem;
}
}

@media only screen and (max-width: 480px){
.page.hall_test #main .block {
padding: 0 0 2rem;
}
}

/******************************

unit

*******************************/

.hall_test #main .unit {
/*padding: 0 0 2rem;*/
}

.hall_test #main .block .unit {
counter-increment: box01;
background-image: linear-gradient(to right, #63513b, #63513b 1px, transparent 1px, transparent 2px);
background-position: left bottom;
background-repeat: repeat-x;
background-size: 4px 1px;
padding-bottom: 1rem;
margin-bottom:1rem;
}

.hall_test #main .block .unit:nth-last-of-type(1) {
margin-bottom:0;
background-image: none;
padding-bottom: 0;
}

.hall_test #main .block:nth-last-of-type(1) .unit {
margin-bottom:0;
background-image: none;
padding: 0 0 2rem;
}


/******************************

ttl

*******************************/

.hall_test #main .ttb {}

@media only screen and (min-width : 1101px){
.hall_test #main .ttb {
margin-bottom: 1rem;
}
}

@media only screen and (max-width : 1100px){
.hall_test #main .ttb {
margin-bottom: 1.5rem;
}
}

.hall_test #main .pagetoptext {}

@media only screen and (min-width : 1101px){
.hall_test #main .pagetoptext {
margin-bottom: 1.5rem;
}
}

@media only screen and (max-width : 1100px){
.hall_test #main .pagetoptext {
margin-bottom: 2rem;
}
}

.hall_test #main .unit-ttl {
font-weight: bold;
color: #39B4BE;
}

.hall_test #main .unit-ttl {}

@media only screen and (min-width: 701px){
.hall_test #main .unit-ttl {
font-size: 1.1rem;
}
}

@media only screen and (min-width: 481px) and (max-width: 700px){
.hall_test #main .unit-ttl {
font-size: 1.25rem;
}
}

@media only screen and (max-width: 480px){
.hall_test #main .unit-ttl {
font-size: 1.0rem;
}
}

@media only screen and (min-width : 701px){
.hall_test #main .unit-ttl {
margin-bottom: .2rem;
}
}

@media only screen and (min-width : 481px) and (max-width : 700px){
.hall_test #main .unit-ttl {
margin-bottom: .4rem;
}
}

@media only screen and (max-width : 480px){
.hall_test #main .unit-ttl {
margin-bottom: .2rem;
}
}


.hall_test #main .unit-ttl::before {
content:"\f1db";
font-family: "FontAwesome";
line-height: 1;
margin-right: 5px;
text-transform: none;
}

/******************************

table

*******************************/

.hall_test #main .table_outer {
width: 100%; overflow: auto;
margin-top: .5rem;
}

.hall_test #main .table_outer::-webkit-scrollbar{
height: 5px; /* スクロールバーの高さ */
}
.hall_test #main .table_outer::-webkit-scrollbar-track{
background: #F1F1F1; /* スクロールバーの背景色 */
}
.hall_test #main .table_outer::-webkit-scrollbar-thumb {
background: #d6d6d6; /* スクロールバーの色 */
}

/*********************
typeA
**********************/

.hall_test #main .table_outer table.typeA {
width:100%;
border-left: #DDD solid 1px;
border-top: #DDD solid 1px;
}

@media only screen and (min-width: 1101px) {
.hall_test #main .table_outer table.typeA {
table-layout: fixed;
}
}

.hall_test #main .table_outer table.typeA th { 
display:table-cell; 
font-weight:700; 
vertical-align: middle;
border-right: #DDD solid 1px;
border-bottom: #DDD solid 1px;
background-color: #F5FCFC;
color: #39B4BE;
text-align: left;
}

@media only screen and (min-width: 701px) {
.hall_test #main .table_outer table.typeA th { 
width: 200px;
padding:.7rem .7rem .7rem 1.5rem;
}
}

@media only screen and (min-width: 601px) and (max-width: 700px){
.hall_test #main .table_outer table.typeA th { 
width: 200px;
padding:.7rem .7rem .7rem 1.5rem;
font-size: 1rem;
}
}

@media only screen and (max-width: 600px){
.hall_test #main .table_outer table.typeA th { 
display: list-item;
width: 100%;
padding:.7rem 1.5rem;
}
}

.hall_test #main .table_outer table.typeA td {
border-right: #DDD solid 1px;
border-bottom: #DDD solid 1px;
}

@media only screen and (min-width: 701px) {
.hall_test #main .table_outer table.typeA td {
padding:.8rem .8rem;
}
}

@media only screen and (min-width: 601px) and (max-width: 700px){
.hall_test #main .table_outer table.typeA td {
padding:.8rem .8rem;
font-size: 1rem;
}
}

@media only screen and (max-width: 600px){
.hall_test #main .table_outer table.typeA td {
display: list-item;
width: 100%;
padding:.7rem 1.5rem;
}
}

/*********************
typeB
**********************/

.hall_test #main .table_outer table.typeB {
width:100%;
border-left: #DDD solid 1px;
border-top: #DDD solid 1px;
}

@media only screen and (min-width: 1101px) {
.hall_test #main .table_outer table.typeB {
table-layout: fixed;
}
}

.hall_test #main .table_outer table.typeB th { 
display:table-cell; 
font-weight:700; 
vertical-align: middle;
border-right: #DDD solid 1px;
border-bottom: #DDD solid 1px;
background-color: #F5FCFC;
color: #39B4BE;
text-align: center;
line-height: 1.5;
}

@media only screen and (min-width: 701px) {
.hall_test #main .table_outer table.typeB th { 
width: 200px;
padding:.6rem;
}
}

@media only screen and (min-width: 601px) and (max-width: 700px){
.hall_test #main .table_outer table.typeB th { 
width: 200px;
padding:.6rem;
font-size: 1rem;
}
}

@media only screen and (max-width: 600px){
.hall_test #main .table_outer table.typeB th { 
display:table-cell;
min-width:150px;
padding:.7rem 1.5rem;
}
}

.hall_test #main .table_outer table.typeB td {
border-right: #DDD solid 1px;
border-bottom: #DDD solid 1px;
text-align: center;
}

@media only screen and (min-width: 701px) {
.hall_test #main .table_outer table.typeB td {
padding:.8rem .8rem;
}
}

@media only screen and (min-width: 601px) and (max-width: 700px){
.hall_test #main .table_outer table.typeB td {
padding:.8rem .8rem;
font-size: 1rem;
}
}

@media only screen and (max-width: 600px){
.hall_test #main .table_outer table.typeB td {
display:table-cell;
min-width:150px;
padding:.7rem 1.5rem;
}
}

.hall_test #main .table_outer + p {}

@media only screen and (min-width : 1101px){
.hall_test #main .table_outer + p {
margin-top: 1rem;
}
}

@media only screen and (max-width : 1100px){
.hall_test #main .table_outer + p {
margin-top: 1rem;
}
}

.hall_test #main ol.number {}

.hall_test #main ol.number li {
letter-spacing: 0.1em;
position: relative;
counter-increment: number01;
}

.hall_test #main ol.number li::before {
content: "(" counter(number01) ")";
margin-right: .5rem;
}

.hall_test #main .separator {}

@media only screen and (min-width : 501px){
.hall_test #main .separator {
display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex;
}
}

.hall_test #main .separator .photo {}

@media only screen and (min-width : 1001px){
.hall_test #main .separator .photo {
width: 155px;
}
}

@media only screen and (min-width : 701px) and (max-width : 1000px){
.hall_test #main .separator .photo {
width: 180px;
}
}


@media only screen and (min-width : 601px) and (max-width : 700px){
.hall_test #main .separator .photo {
width: 180px;
}
}

@media only screen and (min-width : 501px) and (max-width : 600px){
.hall_test #main .separator .photo {
width: 260px;
}
}

@media only screen and (min-width : 501px){
.hall_test #main .separator .photo {
padding-left: 20px;
}

.hall_test #main .separator:after {
content: '';
display: block;
clear: both;
}

.hall_test #main .separator {
zoom: 1; /* for IE */
}
}

@media only screen and (max-width : 500px){
.hall_test #main .separator .photo {
width: 100%;
margin-top:2rem;
}
}

.hall_test #main .separator .table_outer {}

@media only screen and (min-width : 1001px){
.hall_test #main .separator .table_outer {
width: calc(100% - 175px);
}
}

@media only screen and (min-width : 701px) and (max-width : 1000px){
.hall_test #main .separator .table_outer {
width: calc(100% - 200px);
}
}

@media only screen and (min-width : 601px) and (max-width : 700px){
.hall_test #main .separator .table_outer {
width: calc(100% - 200px);
}
}

@media only screen and (min-width : 501px) and (max-width :600px){
.hall_test #main .separator .table_outer {
width: calc(100% - 260px);
}
}

@media only screen and (max-width : 500px){
.hall_test #main .separator .table_outer {
width: 100%;
}
}

.hall_test #main .separator .table_outer table.typeA th {}

@media only screen and (min-width: 701px) {
.hall_test #main .separator .table_outer table.typeA th { 
max-width: 230px;
}
}

@media only screen and (min-width: 501px) and (max-width: 700px){
.hall_test #main .separator .table_outer table.typeA th { 
max-width: 100%;
}
}

@media only screen and (max-width: 500px){
.hall_test #main .separator .table_outer table.typeA th { 
display: list-item;
width: 100%;
padding:.7rem 1.5rem;
}
}

.hall_test #main .unit_inner {
display: block;
background-color: #F5FCFC;
padding: 1rem 2.5rem;
margin: 1rem 0 0;
}

.hall_test #main .unit_inner span {
font-weight: bold;
color: #39B4BE;
}

.hall_test #main .emphasis {
font-weight: bold;
color: #39B4BE;
}

/*btn*/
.hall_test #main .btn_wrapper {
display: flex;
justify-content: space-between;
gap: 1rem;
text-align: center;
margin-top: 1.3rem;
}

.hall_test #main .nextpage {
width: calc(50% - .5rem);
text-align: center;
display: flex;
}

.hall_test #main .nextpage a {
width: 100%;
margin: 0 auto;
border: 2px solid #39B4BE;
background-color:transparent;
display: flex;
padding: 0 1rem;
justify-content: center;
align-items: center;
text-decoration: none;
color: #39B4BE;
font-size: 110%;
border-radius: 8px;
flex-direction: column;
flex: 1 0 auto;
}

@media only screen  and (min-width: 801px){
.hall_test #main .nextpage a {
line-height: 1.5;
font-size: 1.1rem;
padding: 1rem .5rem;
}
}

@media only screen  and (min-width: 601px) and (max-width: 800px){
.hall_test #main .nextpage a {
line-height: 1.5;
font-size: 1.2rem;
padding: 1rem .5rem;
}
}

@media only screen  and (min-width: 481px) and (max-width: 600px){
.hall_test #main .nextpage a {
width: 100%;
padding: 1rem .5rem;
font-size: 1.2rem;
justify-content: center;
line-height: 1.5;
}
}

@media only screen and (max-width: 480px){
.hall_test #main .nextpage a {
width: 100%;
font-size: .95rem;
padding: .5rem .5rem;
justify-content: center;
line-height: 1.5;
}
}

.hall_test #main .nextpage a:hover {
border-color:#39B4BE;
background-color:#F5FCFC;
color: #39B4BE;
}

.hall_test #main .nextpage a span {
text-align: left;
}

.hall_test #main .nextpage a span::before {
content:"\f003";
font-family: "FontAwesome";
line-height: 1;
margin-right: 5px;
text-transform: none;
}

.hall_test #main .nextpage.pdf a span::before {
content:"\f1c1";
font-family: "FontAwesome";
line-height: 1;
margin-right: 5px;
text-transform: none;
}

.hall_test #main .hall_divider{
    display: flex;
    flex-wrap: wrap;
    margin-bottom: 1rem;
}

.hall_test #main .hall_divider .table_outer{
    width: calc(50% - 20px);
    margin-right: 20px;
}

.hall_test #main .hall_divider > p{
    width: 50%;
}

@media only screen  and (min-width: 601px) and (max-width: 800px){
    .hall_test #main .hall_divider {

    }
}

@media only screen  and (max-width: 600px){
    .hall_test #main .hall_divider {
        
    }
    .hall_test #main .hall_divider .table_outer{
        width: 100%;
        margin-right: 0;
    }
    .hall_test #main .hall_divider > p{
        width: 100%;
    }
}

@media only screen and (max-width: 480px){
    .hall_test #main .hall_divider {
    
    }
}


/*************************************************************************************
**************************************************************************************

events

**************************************************************************************
**************************************************************************************/

.events {}

.events #main {}

@media only screen and (min-width: 701px){
.events #main {
padding: 2.5rem 0 3rem;
}
}

@media only screen and (min-width: 481px) and (max-width: 700px){
.events #main {
padding: 2rem 0 3rem;
}
}

@media only screen and (max-width: 480px){
.events #main {
padding: 1.5rem 0 2.5rem;
}
}

.events #main img {
width: 100%;
image-rendering: -webkit-optimize-contrast;
}

/******************************

block

*******************************/

.page.events #main .block {
padding: 0 0;
}

/******************************

unit

*******************************/

.events #main .unit {}

@media only screen  and (min-width: 701px){
.events #main .unit {
padding: 1rem 0 .7rem;
}
}

@media only screen and (max-width: 700px){
.events #main .unit {
padding: 1rem 0 1rem;
}
}

.events #main .unit_inner {
display: block;
background-color: #F5FCFC;
margin: 1rem 0 0;
}

@media only screen  and (min-width: 701px){
.events #main .unit_inner {
padding: 1.5rem 2.5rem;
}
}

@media only screen and (max-width: 700px){
.events #main .unit_inner {
padding: 2rem 2.5rem;
}
}

.events #main .unit_inner span {
font-weight: bold;
color: #39B4BE;
}

/******************************

ttl

*******************************/

.events #main .ttb {}

@media only screen and (min-width : 1101px){
.events #main .ttb {
margin-bottom: 1.7rem;
}
}

@media only screen and (max-width : 1100px){
.events #main .ttb {
margin-bottom: 1.5rem;
}
}

.events #main .unit-ttl {
font-weight: bold;
color: #39B4BE;
}

.events #main .unit-ttl {}

@media only screen and (min-width: 701px){
.events #main .unit-ttl {
font-size: 1.1rem;
}
}

@media only screen and (min-width: 481px) and (max-width: 700px){
.events #main .unit-ttl {
font-size: 1.25rem;
}
}

@media only screen and (max-width: 480px){
.events #main .unit-ttl {
font-size: 1.0rem;
}
}

@media only screen and (min-width : 701px){
.events #main .unit-ttl {
margin-bottom: .2rem;
}
}

@media only screen and (min-width : 481px) and (max-width : 700px){
.events #main .unit-ttl {
margin-bottom: .4rem;
}
}

@media only screen and (max-width : 480px){
.events #main .unit-ttl {
margin-bottom: .2rem;
}
}

.events #main .unit-ttl::before {
content:"\f1db";
font-family: "FontAwesome";
line-height: 1;
margin-right: 5px;
text-transform: none;
}

/******************************

btn

*******************************/

.events #main .nextpage {
text-align: center;
margin-top: 2rem;
}

.events #main .nextpage a {
width: 100%;
margin: 0 auto;
border: 2px solid #39B4BE;
background-color:transparent;
display: inline-block;
text-align: center;
text-decoration: none;
color: #39B4BE;
font-size: 110%;
border-radius: 8px;
}

@media only screen  and (min-width: 801px){
.events #main .nextpage a {
line-height: 3.3rem;
font-size: 1.1rem;
}
}

@media only screen  and (min-width: 601px) and (max-width: 800px){
.events #main .nextpage a {
line-height: 3.5rem;
font-size: 1.2rem;
}
}

@media only screen  and (min-width: 481px) and (max-width: 600px){
.events #main .nextpage a {
width: 100%;
line-height: 4rem;
font-size: 1.4rem;
}
}

@media only screen and (max-width: 480px){
.events #main .nextpage a {
width: 100%;
line-height: 2.7rem;
font-size: .95rem;
}
}

.events #main .nextpage a:hover {
border-color:#39B4BE;
background-color:#F5FCFC;
color: #39B4BE;
}

.events #main .nextpage a span::before {
content:"\f003";
font-family: "FontAwesome";
line-height: 1;
margin-right: 5px;
text-transform: none;
}


/*************************************************************************************
**************************************************************************************

contact

**************************************************************************************
**************************************************************************************/

.contact {}

.contact #main {}

@media only screen and (min-width: 701px){
.contact #main {
padding: 2rem 0 .5rem;
}
}

@media only screen and (min-width: 481px) and (max-width: 700px){
.contact #main {
padding: 2rem 0 0;
}
}

@media only screen and (max-width: 480px){
.contact #main {
padding: 1.5rem 0 0;
}
}

.contact #main img {
width: 100%;
image-rendering: -webkit-optimize-contrast;
}

/******************************

block

*******************************/

.page.contact #main .block {
padding: 0 0;
}

.page.contact #main .unit {
margin: 0 0 1rem;
}

/******************************

ttl

*******************************/

.contact #main .ttb {}

@media only screen and (min-width : 1101px){
.contact #main .ttb {
margin-bottom: 2rem;
}
}

@media only screen and (max-width : 1100px){
.contact #main .ttb {
margin-bottom: 2rem;
}
}

.contact #main .unit-ttl {
font-weight: bold;
color: #39B4BE;
}

.contact #main .unit-ttl {}

@media only screen and (min-width: 701px){
.contact #main .unit-ttl {
font-size: 1.1rem;
}
}

@media only screen and (min-width: 481px) and (max-width: 700px){
.contact #main .unit-ttl {
font-size: 1.25rem;
}
}

@media only screen and (max-width: 480px){
.contact #main .unit-ttl {
font-size: 1.0rem;
}
}

@media only screen and (min-width : 701px){
.contact #main .unit-ttl {
margin-bottom: .2rem;
}
}

@media only screen and (min-width : 481px) and (max-width : 700px){
.contact #main .unit-ttl {
margin-bottom: .4rem;
}
}

@media only screen and (max-width : 480px){
.contact #main .unit-ttl {
margin-bottom: .2rem;
}
}

.contact #main .unit-ttl::before {
content:"\f1db";
font-family: "FontAwesome";
line-height: 1;
margin-right: 5px;
text-transform: none;
}

/******************************

table

*******************************/

.contact #main table {
width:100%;
border-left: #DDD solid 1px;
border-top: #DDD solid 1px;
margin-top: 1.3rem;
}

@media only screen and (min-width: 1101px) {
.contact #main table {
table-layout: fixed;
}
}

@media only screen and (min-width: 701px) {
.contact #main table {
margin-bottom: 1.5rem;
}
}

@media only screen and (min-width: 601px) and (max-width: 700px){
.contact #main table {
margin-bottom: 1.5rem;
}
}

@media only screen and (max-width: 600px){
.contact #main table {
margin-bottom: 1.5rem;
}
}

.contact #main table th { 
display:table-cell; 
vertical-align: middle;
border-right: #DDD solid 1px;
border-bottom: #DDD solid 1px;
background-color: #F5FCFC;
color: #39B4BE;
text-align: left;
}

@media only screen and (min-width: 701px) {
.contact #main table th {
width: 250px;
padding:.7rem .7rem .7rem 1.5rem;
}
}

@media only screen and (min-width: 601px) and (max-width: 700px){
.contact #main table th {
width: 230px;
padding:.7rem .7rem .7rem 1.5rem;
}
}

@media only screen and (max-width: 600px){
.contact #main table th {
display: list-item;
list-style: none;
width: 100%;
padding:.7rem 1.5rem;
}
}

.contact #main table td {
border-right: #DDD solid 1px;
border-bottom: #DDD solid 1px;
}

@media only screen and (min-width: 701px) {
.contact #main table td {
padding:.8rem .8rem;
}
}

@media only screen and (min-width: 601px) and (max-width: 700px){
.contact #main table td {
padding:.8rem .8rem;
}
}

@media only screen and (max-width: 600px){
.contact #main table td {
display: list-item;
list-style: none;
width: 100%;
padding:.7rem 1.5rem;
}
}

.contact #main .must {
font-size: 80%;
} 

/******************************

submit

*******************************/

.contact #main input[type="submit"] {
width: 100%;
}

@media only screen and (min-width: 700px){
.contact #main input[type="submit"] {
line-height: 3.3rem;
margin: 1.5rem 0 0;
font-size:1rem;
}
}

@media only screen and (min-width: 551px)and (max-width: 700px){
.contact #main input[type="submit"] {
line-height: 3.5rem;
margin: 1.5rem 0 0;
font-size:1.3rem;
}
}

@media only screen and (min-width: 481px)and (max-width: 550px){
.contact #main input[type="submit"] {
line-height: 4rem;
margin: 1.5rem 0 0;
font-size:1.3rem;
}
}

@media only screen and (max-width: 480px){
.contact #main input[type="submit"] {
line-height: 3.0rem;
margin: 1.5rem 0 0;
font-size:1rem;
}
}

/*************************************************************************************
**************************************************************************************

confirm

**************************************************************************************
**************************************************************************************/

.confirm {}

.confirm #main {}

@media only screen and (min-width: 701px){
.confirm #main {
padding: 2rem 0 1rem;
}
}

@media only screen and (min-width: 481px) and (max-width: 700px){
.confirm #main {
padding: 2rem 0 0;
}
}

@media only screen and (max-width: 480px){
.confirm #main {
padding: 1.5rem 0 0;
}
}

.confirm #main img {
width: 100%;
image-rendering: -webkit-optimize-contrast;
}

/******************************

block

*******************************/

.page.confirm #main .block {
padding: 0 0;
}

/******************************

ttl

*******************************/

.confirm #main .ttb {}

@media only screen and (min-width : 1101px){
.confirm #main .ttb {
margin-bottom: 1rem;
}
}

@media only screen and (max-width : 1100px){
.confirm #main .ttb {
margin-bottom: 1.5rem;
}
}

/******************************

table

*******************************/

.confirm #main table {
width:100%;
border-left: #DDD solid 1px;
border-top: #DDD solid 1px;
margin-top: 1.3rem;
}

@media only screen and (min-width: 1101px) {
.confirm #main table {
table-layout: fixed;
}
}

@media only screen and (min-width: 701px) {
.confirm #main table {
margin-bottom: 2.5rem;
}
}

@media only screen and (min-width: 481px) and (max-width: 700px){
.confirm #main table {
margin-bottom: 2.5rem;
}
}

@media only screen and (max-width: 480px){
.confirm #main table {
margin-bottom: 2rem;
}
}

.confirm #main table th { 
display:table-cell; 
vertical-align: middle;
border-right: #DDD solid 1px;
border-bottom: #DDD solid 1px;
background-color: #F5FCFC;
color: #39B4BE;
text-align: left;
}

@media only screen and (min-width: 701px) {
.confirm #main table th {
width: 250px;
padding:.7rem .7rem .7rem 1.5rem;
}
}

@media only screen and (min-width: 601px) and (max-width: 700px){
.confirm #main table th {
width: 230px;
padding:.7rem .7rem .7rem 1.5rem;
}
}

@media only screen and (max-width: 600px){
.confirm #main table th {
display: list-item;
list-style: none;
width: 100%;
padding:.7rem 1.5rem;
}
}

.confirm #main table td {
border-right: #DDD solid 1px;
border-bottom: #DDD solid 1px;
}

@media only screen and (min-width: 701px) {
.confirm #main table td {
padding:.8rem .8rem;
}
}

@media only screen and (min-width: 601px) and (max-width: 700px){
.confirm #main table td {
padding:.8rem .8rem;
}
}

@media only screen and (max-width: 600px){
.confirm #main table td {
display: list-item;
list-style: none;
width: 100%;
padding:.7rem 1.5rem;
}
}

.confirm #main .separator {
text-align: center;
}

/******************************

submit

*******************************/

.confirm #main input[type="submit"],
.confirm #main input[type="button"] {
width: 48%;
}

.confirm #main input[type="submit"] {
margin-left: .9%;
}

.confirm #main input[type="button"] {
margin-right: .9%;
}

@media only screen and (min-width: 700px){
.confirm #main input[type="submit"],
.confirm #main input[type="button"] {
line-height: 3.3rem;
font-size:1rem;
}
}

@media only screen and (min-width: 551px)and (max-width: 700px){
.confirm #main input[type="submit"],
.confirm #main input[type="button"] {
line-height: 3.5rem;
font-size:1.3rem;
}
}

@media only screen and (min-width: 481px)and (max-width: 550px){
.confirm #main input[type="submit"],
.confirm #main input[type="button"] {
line-height: 4rem;
font-size:1.3rem;
}
}

@media only screen and (max-width: 480px){
.confirm #main input[type="submit"],
.confirm #main input[type="button"] {
line-height: 3.0rem;
font-size:1rem;
}
}


/*************************************************************************************
**************************************************************************************

thanks

**************************************************************************************
**************************************************************************************/

.thanks {}

.thanks #main {
}

@media only screen and (min-width: 701px){
.thanks #main {
padding: 2.5rem 0 3rem;
}
}

@media only screen and (min-width: 481px) and (max-width: 700px){
.thanks #main {
padding: 2.5rem 0 3rem;
}
}

@media only screen and (max-width: 480px){
.thanks #main {
padding: 1.8rem 0 2rem;
}
}

.thanks #main img {
width: 100%;
image-rendering: -webkit-optimize-contrast;
}

/******************************

block

*******************************/

.thanks #main .block {
padding: 0 0;
}

/******************************

ttl

*******************************/

.thanks #main .ttb {}

@media only screen and (min-width : 1101px){
.thanks #main .ttb {
margin-bottom: 1rem;
}
}

@media only screen and (min-width : 701px) and (max-width : 1100px){
.thanks #main .ttb {
margin-bottom: 1.5rem;
}
}

@media only screen and (min-width : 481px) and (max-width : 700px){
.thanks #main .ttb {
margin-bottom: 1.2rem;
}
}

@media only screen and (max-width : 480px){
.thanks #main .ttb {
margin-bottom: 1.0rem;
}
}


/*************************************************************************************
**************************************************************************************

service

**************************************************************************************
**************************************************************************************/

.service {}

.service #main {
}

@media only screen and (min-width: 701px){
.service #main {
padding: 2.5rem 0 .5rem;
}
}

@media only screen and (min-width: 551px) and (max-width: 700px){
.service #main {
padding: 2.5rem 0 .5rem;
}
}

@media only screen and (max-width: 550px){
.service #main {
padding: 1.8rem 0 3rem;
}
}

.service #main img {
width: 100%;
image-rendering: -webkit-optimize-contrast;
}

/******************************

block

*******************************/

.service #main .block {
padding: 0 0;
}

/******************************

unit

*******************************/

.service #main .unit {}

@media only screen  and (min-width: 1151px){
.service #main .unit {
padding: 0 0 3rem;
}
}

@media only screen  and (min-width: 701px)  and (max-width: 1150px){
.service #main .unit {
padding: 0 0 3rem;
}
}

@media only screen  and (min-width: 481px)  and (max-width: 700px){
.service #main .unit {
padding: 0 0 3rem;
}
}

@media only screen  and (min-width: 401px)  and (max-width: 480px){
.service #main .unit {
padding: 0 0 3rem;
}
}

@media only screen and (min-width: 551px){
.service #main .unit {
display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex;
/*
-webkit-box-align: center;	-webkit-align-items: center;	-ms-flex-align: center;	align-items: center;
*/
}
}

@media only screen and (max-width: 550px){
.service #main .unit {
background-image: linear-gradient(to right, #63513b, #63513b 1px, transparent 1px, transparent 2px);
background-position: left bottom;
background-repeat: repeat-x;
background-size: 4px 1px;
padding-bottom: 2.3rem;
margin: 0 auto 2.3rem;
}

.service #main .unit:nth-last-of-type(1) {
margin-bottom:0;
background-image: none;
padding-bottom: 0;
}
}

@media only screen and (min-width: 481px) and (max-width: 550px){
.service #main .unit {
width: 70%;
}
}

@media only screen and (min-width: 431px) and (max-width: 480px){
.service #main .unit {
width: 80%;
}
}

@media only screen and (max-width: 430px){
.service #main .unit {
width: 100%;
}
}

.service #main .unit .photo {
position: relative;
}

@media only screen and (min-width: 701px){
.service #main .unit .photo {
width: 140px;
min-height: 150px;

display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex;
-webkit-box-align: center;	-webkit-align-items: center;	-ms-flex-align: center;	align-items: center;
}
}

@media only screen and (min-width: 551px) and (max-width: 700px){
.service #main .unit .photo {
width: 120px;
min-height: 120px;

display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex;
-webkit-box-align: center;	-webkit-align-items: center;	-ms-flex-align: center;	align-items: center;
}
}

@media only screen and (max-width: 550px){
.service #main .unit .photo {
width: 100%;
text-align: center;
margin-bottom: 15px;
}
}

@media only screen and (max-width: 400px){
.service #main .unit .photo {
margin-bottom: 12px;
}
}

.service #main .unit .photo::after {}

@media only screen and (min-width: 551px){
.service #main .unit .photo::after {
content: "";
width: 3px;
height: 100%;
background-color:#66D2D8;
display: block;
position: absolute;
right: 0;
top: 0;
}
}

@media only screen and (min-width: 701px){
.service #main .unit .photo::after {
min-height: 150px;
}
}

@media only screen and (min-width: 551px) and (max-width: 700px){
.service #main .unit .photo::after {
min-height: 120px;
}
}

.service #main .unit .photo img {
width: 100%;
}

@media only screen and (min-width: 701px){
.service #main .unit .photo img {
max-width: 90px;
}
}

@media only screen and (min-width: 551px) and (max-width: 700px){
.service #main .unit .photo img {
max-width: 90px;
}
}

@media only screen and (min-width: 481px) and (max-width: 550px){
.service #main .unit .photo img {
max-width: 90px;
}
}

@media only screen and (min-width: 401px) and (max-width: 480px){
.service #main .unit .photo img {
max-width: 90px;
}
}

@media only screen and (max-width: 400px){
.service #main .unit .photo img {
max-width: 90px;
}
}

.service #main .unit .text {
position: relative;
}

@media only screen and (min-width: 551px){
.service #main .unit .text {
width: calc(100% - 140px);
padding-left: 35px;
}
}

@media only screen and (max-width: 550px){
.service #main .unit .text {
max-width: 100%;
width: auto;
}
}

.service #main .unit .unit-ttl {
font-weight: bold;
color: #39B4BE;
}

.service #main .unit .unit-ttl {}

@media only screen and (min-width: 701px){
.service #main .unit .unit-ttl {
font-size: 1.25rem;
}
}

@media only screen and (min-width: 601px) and (max-width: 700px){
.service #main .unit .unit-ttl {
font-size: 1.4rem;
}
}

@media only screen and (min-width: 551px) and (max-width: 600px){
.service #main .unit .unit-ttl {
font-size: 1.6rem;
}
}

@media only screen and (min-width: 481px) and (max-width: 550px){
.service #main .unit .unit-ttl {
font-size: 1.6rem;
text-align: center;
}
}

@media only screen and (min-width: 401px) and (max-width: 480px){
.service #main .unit .unit-ttl {
font-size: 1.1rem;
text-align: center;
}
}

@media only screen and (max-width: 400px){
.service #main .unit .unit-ttl {
font-size: 1.3rem;
text-align: center;
}
}

@media only screen and (min-width : 701px){
.service #main .unit .unit-ttl {
margin-bottom: .3rem;
}
}

@media only screen and (min-width : 551px) and (max-width : 700px){
.service #main .unit .unit-ttl {
margin-bottom: .4rem;
}
}

@media only screen and (min-width: 401px) and (max-width: 550px){
.service #main .unit .unit-ttl {
margin-bottom: .6rem;
}
}

@media only screen and (max-width: 400px){
.service #main .unit .unit-ttl {
margin-bottom: .8rem;
}
}