.ario_info{
    width: 95%;
    margin: 0 auto;
    background: #fff;
    padding: 0 15px;
}
}

.access{
display: block;
    margin: 0 auto;
    width: 75%;
background-color: #fffffb;
}

.access img{
width: 90%;
    margin: 0 auto;
    display: block;
}

.acc-tx{
text-align: center;
    padding-top: 20px;
    margin-bottom: 15px;
    font-size: 14px;
}


 /*撮影楽しもう*/
.aro-content {
	width: 100%;
	height: 400px; /* 画像の高さを指定 */
	position: relative;
	background: url("/img/ario-yao/bg-photo2.jpg") repeat-x 0 0;
	background-size: auto 100%;
	animation: bg-slider 86s linear infinite; /* 23sの部分背景画像の約数だとスムーズ */
	padding: 0;
}

 /*撮影楽しもう*/
.aro-content2 {
	width: 100%;
	height: 400px; /* 画像の高さを指定 */
	position: relative;
	background: url("/img/ario-yao/bg-joy2.jpg") repeat-x 0 0;
	background-size: auto 100%;
	animation: bg-slider 86s linear infinite; /* 23sの部分背景画像の約数だとスムーズ */
	padding: 0;
}
@keyframes bg-slider {
	from { background-position: 0 0; }
    to { background-position: -1920px 0; } /* 2341pxとは使用した背景画像の長さ */
}

.content {
    padding: 60px;
	border-top-color: #0d3387;
}

header {
	margin: 0 0 0 0;}
#contentWrap #mainContentWrap {
    width: 100%;
    display: flex;
    justify-content: center;
    align-items: center;}

.pcdisplay ul{display:none;}

#openspace {
    position: relative;
    width: 100%;}

#contents section, #openspace {
    max-width: 900px;
    clear: both;
    margin: auto;}

.concept-copy-title {
    font-family: inherit;}
#openspace .titleBox .inr {
    background: #FFF;
    padding: 10%;
    border-radius: 20px;}

#openspace .titleBox {
    background: #FFF;
    position: absolute;
    left: 2%;
    top: 53%;
    transform: translate(0, -50%);
    -o-transform: translate(0, -50%);
    -ms-transform: translate(0, -50%);
    -moz-transform: translate(0, -50%);
    -webkit-transform: translate(0, -50%);
    width: 50%;
    max-width: 45%;
    border-radius: 20px;
    z-index: 10;}

#openspace figure img {
    max-width: 60%;
    margin: 0 auto;
    display: block;}

#openspace .titleBox h2 {
    position: relative;
    margin-bottom: 10%;}

#openspace .titleBox h2 span.hontitle {
    color: #000;
    font-size: 28px;
    font-weight: 400;
    letter-spacing: 1px;
    margin-bottom: 7px;}

#openspace .titleBox h2 span.sabtitle {
    color: #f24469;
    font-size: 8px;
    font-weight: 200;
    letter-spacing: 2px;
    margin-bottom: 10px;}
#contents p {
    font-size: 16px;
    line-height: 1.7;
    letter-spacing: 0.05em;
    padding-bottom: 32px;
    text-align: center;}

#openspace figure {
    padding: 5% 0 0;
    position: relative;
    text-align: left;
    left: 190px;}

#contents p {
    font-size: 16px;
    line-height: 1.7;
    letter-spacing: 0.05em;}


dl.accordion dt {

    padding: 1.5rem 0.5rem 1.5rem 4rem;
    width: 98%;
    margin: 10px auto;}

.shoparea{
width: 32%;
    display: inline-table;
    padding: 20px 20px 20px 20px;
    margin: 4px 4.5px;
    border: 1px dashed;
    height: 160px;}

.tokuten{
font-size: small;
    background-color: #e6007f;
    color: #fff;
    font-weight: 500;
    display: table;
    padding: 0 5px 0px 5px;}

dl.accordion dd {

}
.food{
    font-size: 11px;
    font-weight: lighter;
    text-align: left;
    margin-top: 0px;
    margin-bottom: 5px;
    color: #666666;
    background-color: #fff0f5;
    border-left: none;
    margin-right: 10px;
    padding: 2px 5px;}

.tenmei{
color: #252525;
    padding-bottom: 11px;
    font-size: 16px;
    padding: 0px 5px 0 5px;}


.lip {
    max-width: 650px;
    margin: 0 auto;
    padding-bottom: 50px;}
.lip h4, .lip h3 {
    display: inline;
    background: #f89174;
    color: #fff;
    margin-left: 0;
    border-radius: 7px 7px 0 0;
    font-size: 15px !important;
    padding: 7.7px 10px;
	border: none;}
	
.lip ul {
    background: #fffbf4;
    margin-top: 0;
    padding: 1em .5em 1em 1.5em;
	border: solid 2px #f89174;}
	
.lip ul li {
    position: relative;
    padding-left: 25px;}

	.lip ul li:before {
    left: 0;
    position: absolute;
    font-family: FontAwesome;
    content:"\f00c";
    color: #f89174;}
	.bold {
    font-weight: 600;}
	.bl {
    display: block;}

.square_btn{
    display: inherit;
    border-radius: 12px;
    padding: 30px 20px;
    text-decoration: none;
    color: #FFF;
    font-size: large;
    background-color: #e6007f;
    transition: .4s;
    font-weight: 900;
    width: 70%;
    text-align: center;
    margin: 0 auto;
    margin-top: 20px;}
.square_btn:hover {
    background-color: #f17bbc;}

.square_btn6{
    padding: 7px 20px;
    border-radius: 6px;
    text-decoration: none;
    color: #FFF;
    font-size: large;
    background-color: #ff7f50;
    transition: .4s;
    font-weight: 900;
    width: 80%;
    text-align: center;
    margin: 0 auto;
}

.square_btn2{
    display: inherit;
    border-radius: 12px;
    padding: 30px 20px;
    text-decoration: none;
    color: #FFF;
    font-size: large;
    background-color: #193cc7;
    transition: .4s;
    font-weight: 900;
    width: 70%;
    text-align: center;
    margin: 0 auto;
    margin-top: 20px;}
.square_btn2:hover {
    background-color: #6a83e4;}

.square_btn3{
    display: inherit;
    border-radius: 12px;
    padding: 30px 20px;
    text-decoration: none;
    color: #FFF;
    font-size: large;
    background-color: #079468;
    transition: .4s;
    font-weight: 900;
    width: 70%;
    text-align: center;
    margin: 0 auto;
    margin-top: 20px;}
.square_btn3:hover {
    background-color: #59e4b9;
}

.square_btn4{
    display: inherit;
    border-radius: 12px;
    padding: 30px 20px;
    text-decoration: none;
    color: #FFF;
    font-size: large;
    background-color: #fda703;
    transition: .4s;
    font-weight: 900;
    width: 50%;
    text-align: center;
    margin: 0 auto;
    margin-top: 20px;}
.square_btn4:hover {
    background-color: #fbc153;}

.square_btn5{
    display: inherit;
    border-radius: 12px;
    padding: 30px 20px;
    text-decoration: none;
    color: #FFF;
    font-size: large;
    background-color: #0a38a3;
    transition: .4s;
    font-weight: 900;
    width: 50%;
    text-align: center;
    margin: 0 auto;
    margin-top: 20px;}
.square_btn5:hover {
    background-color: #487df7;}

.arrow_box {
    width: 85%;
    position: relative;
    background: #0d3387;
    border: 8px solid #ffffff;
    margin: 0 auto;}
.arrow_box:after, .arrow_box:before {
	top: 100%;
	left: 50%;
	border: solid transparent;
	content: " ";
	height: 0;
	width: 0;
	position: absolute;
	pointer-events: none;}

.arrow_box:after {
	border-color: rgba(13, 51, 135, 0);
	border-top-color: #0d3387;
	border-width: 23px;
	margin-left: -23px;}
.arrow_box:before {
	border-color: rgba(255, 255, 255, 0);
	border-top-color: #ffffff;
	border-width: 34px;
	margin-left: -34px;}

.arrow_box2 {
    width: 100%;
    position: relative;
    border: 8px solid #ffffff;
    margin: 0 auto;
    padding: 102px 0px;}
.arrow_box2:after, .arrow_box2:before {
	top: 100%;
	left: 50%;
	border: solid transparent;
	content: " ";
	height: 0;
	width: 0;
	position: absolute;
	pointer-events: none;}

.arrow_box2:after {
	border-color: rgba(13, 51, 135, 0);
	border-width: 23px;
	margin-left: -23px;}
.arrow_box2:before {
	border-color: rgba(255, 255, 255, 0);
	border-top-color: #ffffff;
	border-width: 34px;
	margin-left: -34px;}

.logo {
color: #fff;
    text-align: left;
    font-size: 45px;
    line-height: 74px;
    font-weight: bold;
    text-transform: uppercase;
    text-shadow: 0 1px 2px rgba(0, 0, 0, 0.4);
    width: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    background-color: #0c338766; }

.logo1 {
color: #fff;
    text-align: center;
    font-size: 38px;
    line-height: 74px;
    font-weight: bold;
    text-transform: uppercase;
    text-shadow: 0 1px 2px rgba(0, 0, 0, 0.4);
    width: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    padding-top: 30px;}

.logo2 {
color: #fff;
    text-align: center;
    font-size: 16px;
    line-height: 19px;
    font-weight: bold;
    text-transform: uppercase;
    text-shadow: 0 1px 2px rgba(0, 0, 0, 0.4);
    width: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    border-left: none;
    padding-bottom: 30px;}

.ario0,ario1,ario2,ario3{
    width: 100%;
} 
.ario00{
background: url("/img/191005ario_otori/catch_back.png");
    margin-top: -6px;
}
.ario0{
    background-color: #0d3387; }
.ario1{

    background-color: #f599a0;
    margin-top: -6px;
    padding: 10px;}
.ario2{
    background-color: #3fa9f5; 
    text-align: center;}

.ario3{
    background-color: #fff; 
    text-align: center;
}

.ario2-5{
    background-color: #f599a0; 
    text-align: center;}

.ario1 img{
    width: 65%;
    margin: auto;
    display: block;
    padding-bottom: 30px;	
}

.ario3 img{
    width:70%; 
    filter: drop-shadow(10px 10px 10px rgba(0,0,0,0.6));
    padding-bottom: 40px;
}

.ario2-5 img{
width:70%; 
    filter: drop-shadow(10px 10px 10px rgba(0,0,0,0.6));
    padding-bottom: 40px;}

.ario2 img{
    width:70%; 
    filter: drop-shadow(10px 10px 10px rgba(0,0,0,0.6));
    padding-bottom: 40px;}
.ario_text{
    color: #fff;
    text-align: center;
    padding-top: 30px;
    padding-bottom: 30px;
    font-size: large;
    font-weight: bold;}

.ario_text2{
    color: #fff;
    text-align: center;
    padding-bottom: 30px;
    font-size: unset;
    font-weight: bold;}
.shops{

}

@media screen and (min-width:480px){
.ariosp,.sp{display: none;}
}




@media screen and (max-width:320px){
.aro-content{height:324px !important;}
.aro-content2 {height:344px !important;}
.arrow_box2 {
padding:90px 0px;
}
}

@media screen and (max-width:479px){
.access {width:95%;}
.aro-content{height:340px;}
.aro-content2 {height:335px;}
.ario_text {padding-top:10px; padding-bottom: 10px;}

.ariopc{display:none;}	
.logo1,.logo{font-size: 30px!important; line-height: 37px!important;}
.logo2{font-size: 14px!important; line-height: 16px!important;  padding-bottom: 9px !important;}

.square_btn,.square_btn2,.square_btn3{width:90% !important; font-size: initial !important; }
.square_btn{margin-top:0px !important;}
.square_btn4,.square_btn5{width:70% !important; font-size: initial !important; }
.ario2 img{ width: 90% !important;     margin-top: -35px;}
.ario3 img{ width: 90% !important;     margin-top: -35px;}
#openspace .titleBox {
width: 100%;
    max-width: 100%;
    left: 0;
    display: contents;
}
#openspace figure {
    padding: 5% 0 0;
    position: unset;
    text-align: left;
    display: block;
    margin-block-start: 0em;
    margin-block-end: 0em;
    margin-inline-start: 0px;
    margin-inline-end: 0px;
}
#openspace figure img {
    max-width: 100%;
}
#openspace .titleBox .inr {
    background: #FFF;
    padding: 10%;
    border-radius: 0px;
    margin-bottom: 22px;}
#openspace .titleBox h2 span.sabtitle {
    color: #f24469;
    font-size: 8px;
    font-weight: 200;
    letter-spacing: 2px;
    margin-bottom: 10px;}
#openspace .titleBox h2 span.sabtitle {
    color: #f24469;
    font-size: 8px;
    font-weight: 200;
    letter-spacing: 2px;
    margin-bottom: 10px;}
#openspace .titleBox h2 span.hontitle {
    color: #000;
    font-size: 22px;
    font-weight: 400;
    letter-spacing: 1px;
    margin-bottom: 7px;}
#contents p {
    font-size: 16px;
    line-height: 1.7;
    letter-spacing: 0.05em;}
.content{
padding: 0;
    border-top-color: #0d3387;
    margin-top: 40px;}
.shoparea {
    width: 48%;
    display: inline-table;
    padding: 10px 10px 10px 10px;
    margin: 4px 1.1px;
    border: 1px dashed;
    height: 220px;
}
}

}