html,body{
margin: 0%;
padding: 0%;
height:100%;
background-attachment:fixed;
/*border:1px solid black;*/
}
@media screen and (max-width: 550px) {
body {
width: 100%;
height:auto;
}
}
@media screen and (min-width: 551pxpx) {
body {
}
}
.header_fixed{
position: fixed;
z-index: 9999;
top: 0%;
width:100%;
height: auto;
left: 0%;
background-color : #000;
filter:alpha(opacity=0);
-moz-opacity: 0.5;
opacity: 0.5;
background: linear-gradient(#000000, #203744, #e7e7e7);*/
padding:0% 0 0%;
/*border:3px solid red;*/
}
@media screen and (max-width: 550px) {
.header_fixed {
}
}
@media screen and (min-width: 551px) {
.header_fixed{
}
}
.top_box1 {
width:100%;
height:100%;
left:0%;
/*border:5px solid green;*/
}
@media screen and (max-width: 550px) {
.top_box1 {
}
}
@media screen and (min-width: 551px) {
.top_box1 {
}
}
.tbox3 {
margin: 0px;
width: 38%;
height: auto;
display: inline-block;
font-family:"KaiTi", serif;
/*font-family: "Arial", "メイリオ";*/
color: white ;
/*border:3px solid red;*/
}
@media screen and (max-width: 550px) {
.tbox3 {
width: 80%;
font-size: 13px;
font-family:"KaiTi", serif;
}
}
@media screen and (min-width: 551px) {
.tbox3 {
font-size: 1.1vw;
}
}
.index_01_rogo{
margin: 0%;
width: 15%;
height:auto;
display: inline-block;
/*border: 5px solid blue;*/
}
.index_01_rogo > .cress_img{
/*display: inline-block;*/
width: 100%;
}
@media screen and (max-width: 550px) {
.index_01_rogo {
}
.cress_img{
}
}
@media screen and (min-width: 551px) {
.index_01_rogo {
}
.cress_img{
}
}
.tb3cn1 {
display: inline-block;
width: 80%;
height: 100%;
text-align: left;
font-family:"KaiTi", serif;
font-size: 1.2vw;
font-weight: 600;
/*font-family: "Arial", "メイリオ";*/
color: white ;
/*border:3px solid yellow;*/
}
@media screen and (max-width: 550px) {
.tb3cn1 {
font-size: 2.0vw;
}
}
@media screen and (min-width: 551px) {
.tb3cn1 {
}
}
.tb3cn2 {
margin: 0px;
width: 75%;
height: auto;
text-align: center;
display: inline-block;
font-family:"KaiTi", serif;
/*font-family: "Arial", "メイリオ";*/
color: white ;
/*border:3px solid white;*/
}
@media screen and (max-width: 550px) {
.tb3c2 {
font-size: 5.0vw;
}
}
@media screen and (min-width: 551px) {
.tb3cn2 {
font-size: 2.0vw;
color: black ;
font-weight: 700;
}
}
.boxsyousai {
width: 60%;
height: auto;
text-align: center;
display: inline-block;
font-family:"KaiTi", serif;
/*font-family: "Arial", "メイリオ";*/
color: white ;
/*border:3px solid pink;*/
}
@media screen and (max-width: 550px) {
.boxsyousai {
display: none;
}
}
@media screen and (min-width: 551px) {
.boxsyousai {
font-size: 15px;
}
}
.boxsyousai1 {
margin: 5px;
width: 65%;
height: auto;
text-align: right;
display: inline-block;
font-family:"游ゴシック", serif;
/*font-family: "Arial", "メイリオ";*/
color: white ;
/*border:3px solid red;*/
}
@media screen and (max-width: 550px) {
.boxsyousai1 {
display: none;
}
}
@media screen and (min-width: 551px) {
.boxsyousai1 {
}
}
.sadd {
display: inline-block;
position: relative;
width: 95%;
height: auto;
font-family:"KaiTi", serif;
color: white;
font-size: 1.0vw;
text-align: right;
text-decoration: none;
color: white ;
}
@media screen and (max-width: 550px) {
.sadd {
font-size: 3px;
display: none;
}
}
@media screen and (min-width: 551px) {
.sadd {
}
}
.boxsyousai2 {
margin: 5px;
width: 25%;
height: auto;
text-align: center;
display: inline-block;
font-family:"KaiTi", serif;
/*font-family: "Arial", "メイリオ";*/
background: green;*/
border:3px solid red;*/
}
@media screen and (max-width: 550px) {
.boxsyousai2 {
display: none;
}
}
@media screen and (min-width: 551px) {
.boxsyousai2 {
font-size: 15px;
}
}
.boxsyousai2 {
background-color: green;
}
/* マウスオーバー時の背景色 */
.boxsyousai2:hover {
background-color: gray;
opacity: 0.6;
}
.syousai1{
display: inline-block;
position: relative;
width: 95%;
height: auto;
font-family:"KaiTi", serif;
color: white;
font-size: 1.2vw;
text-decoration: none;
color: white ;
}
@media screen and (max-width: 550px) {
.syousai1 {
font-size: 3px;
display: none;
}
}
@media screen and (min-width: 551px) {
.syousai1 {
}
}
.syousai1a{
display: inline-block;
position: relative;
width: 35%;
height: auto;
text-decoration: none;
font-size: 1.1vw;
text-align: center;
font-family:"KaiTi", serif;
color: white;
background: #000000;*
border:3px solid white;*/
}
@media screen and (max-width: 550px) {
.syousai1a {
font-size: 3px;
display: none;
}
}
@media screen and (min-width: 551px) {
.syousai1a {
}
}
.syousai1a {
background-color: #000000;
}
/* マウスオーバー時の背景色 */
.syousai1a:hover {
background-color: gray;
opacity: 0.6;
}
.boxsyousai3 {
margin: 5px;
margin-left: 10px;
width: 100%;
height: auto;
text-align: center;
display: inline-block;
font-family:"KaiTi", serif;
/*font-family: "Arial", "メイリオ";*/
color: white ;
/*border:3px solid pink;*/
}
@media screen and (max-width: 550px) {
.boxsyousai3 {
display: none;
}
}
@media screen and (min-width: 551px) {
.boxsyousai3 {
font-size: 1.3vw;
}
}
.syousai{
margin-top: 5px;
display: inline-block;
position: relative;
width: 18%;
height:auto;
text-decoration: none;
font-size: 1.2vw;
text-align: center;
color: white;
background: #000000;*/
/*border:3px solid white;*/
}
@media screen and (max-width: 550px) {
.syousai {
font-size: 3px;
display: none;
}
}
@media screen and (min-width: 551px) {
.syousai {
}
}
.syousai:before{
content: "";
position: absolute;
left: 0;
bottom: -4px;
width: 100%;
height: 3px;
background: green;
transform: scale(0, 8);
transition: 0.4s;
}
.syousai:hover:before {
transform: scale(1);
}
.boxhan {
display: inline-block;
margin-top: 5px;
width: 10%;
height:auto;
text-align: center;
font-family:"KaiTi", serif;
color:white ;
/*border:3px solid red;*/
}
@media screen and (max-width: 550px) {
.boxhan {
}
}
@media screen and (min-width: 551px) {
.boxhan {
display: none;
}
}
.nav-drawer {
position: relative;
}
@media screen and (max-width: 550px) {
.nav-drawer {
}
}
@media screen and (min-width: 551px) {
.nav-drawer {
}
}
/*チェックボックス等は非表示に*/
.nav-unshown {
display:none;
}
/*アイコンのスペース*/
#nav-open {
display: inline-block;
width: 30px;
height: 22px;
vertical-align: middle;
}
/*ハンバーガーの形をCSSで表現*/
#nav-open span, #nav-open span:before, #nav-open span:after {
position: absolute;
height: 5px;/*線の太さ*/
width: 40px;/*長さ*/
border-radius: 3px;
background: #555;
display: block;
content: '';
cursor: pointer;
}
#nav-open span:before {
bottom: -8px;
}
#nav-open span:after {
bottom: -16px;
}
/*閉じる用の薄黒箇所*/
#nav-close {
display: none;
position: fixed;
z-index: 99;
top: 0;
left: 0;
width: 100%;
height: 100%;
background: black;
opacity: 0;
transition: .3s ease-in-out;
}
/*メニューの中身*/
#nav-content {
overflow: auto;
position: fixed;
top: 0px;
left: 0px;
z-index: 9999;
width: 70%;
max-width: 330px;/*最大幅（お好みで調整を）*/
height: 100%;
background-color: rgba(0,151,167 ,1);
font-size: 20px;
color: black;
transition: .3s ease-in-out;
-webkit-transform: translateX(-105%);
transform: translateX(-105%);
}
/*チェックがついたら表示させる*/
#nav-input:checked ~ #nav-close {
display: block;
opacity: .3;
}
#nav-input:checked ~ #nav-content {
-webkit-transform: translateX(0%);
transform: translateX(0%);
box-shadow: 6px 0 25px rgba(0,0,0,.15);
}
.header-logo-menu{
display: flex;
display: -moz-flex;
display: -o-flex;
display: -webkit-flex;
display: -ms-flex;
flex-direction: row;
-moz-flex-direction: row;
-o-flex-direction: row;
-webkit-flex-direction: row;
-ms-flex-direction: row;
}
/*ロゴやサイトタイトルをセンタリング*/
.logo_area{
text-align:center;
margin:auto;
}
.nav {
margin-top: 80px;
width: 100%;
height: 50%;
text-align: center;
color: white;
font-weight: 700;
/*border:3px solid red;*/
}
@media screen and (max-width: 550px) {
.nav {
}
}
@media screen and (min-width: 551px) {
.nav {
font-size: 2.7vw;
}
}
.nav1 {
padding: 20px;
width: 100%;
height: 10%;
font-family:"游ゴシック", " sans-serif";
text-align: left;
color: white;
/*border:3px solid red;*/
}
@media screen and (max-width: 550px) {
.nav1 {
}
}
@media screen and (min-width: 551px) {
.nav1 {
}
}
.navinfo {
margin-top: 80px;
width: 100%;
height: auto;
text-align: center;
font-size: 18px;
color: white;
font-weight: 700;
border-bottom: solid 5px white;
/*border:3px solid red;*/
}
@media screen and (max-width: 550px) {
.navinfo {
}
}
@media screen and (min-width: 551px) {
.navinfo {
font-size: 2.7vw;
}
}
.sample_p5 {
overflow: hidden;
width: 100px;
height: 182px;
color: green;
text-decoration: none;
font-weight: 700
/*border: 1px solid gray;*/
}
.sample_p5 img {
opacity: 0.9;
width: 150px;
transition: all 0.5s;
}
.sample_p5 img:hover {
opacity: 0.7;
transform: scale(1.2, 1.2);
z-index: 9999;
}
.sample_p6{
display:inline-block;
position: relative;
background:#808080;
width: 80%;
padding:5px 50px 5px 20px;
text-align:center;
text-decoration:none;
color:#FFF;
border:1px solid;
}
.sample_p6::after{
display: block;
position: absolute;
content: "";
top: calc(50% - 5px);
right: 20px;
width: 20px;
height: 5px;
border-right: 2px solid #FFF;
border-bottom: 1px solid #FFF;
transform: skew(45deg);
transition: .3s;
}
.sample_p6:hover::after{
right: 10px;
width: 50px;
}
.sample_p {
width: 100px;
height: 182px;
overflow: hidden;
}
.sample_p img {
opacity: 0.9;
width: 150px;
transition: all 0.5s;
}
.sample_p img:hover {
opacity: 0.7;
transform: scale(1.2, 1.2);
z-index: 9999;
}
.inbox5b {
background-color: white;
}
/* マウスオーバー時の背景色 */
.inbox5b:hover {
background-color: #000;
/*background-color: #ffc9d7;*/
opacity: 0.6;
}
.inbox5b {
background-color: white;
-webkit-transition: all 0.3s ease;
-moz-transition: all 0.3s ease;
-o-transition: all 0.3s ease;
transition: all 0.3s ease;
}
.inbox5b:hover {
opacity: 0.6;
background-color: #000;
/*background-color: #ffc9d7;*/
}
.body_photo{
overflow: hidden;
width:100%;
height: auto;
background-color:#eee;
/*border:3px solid blue;*/ /*日帰りのバーベキュー、*/
}
.body_photo > .body_img {
/*display: inline-block;*/
/*text-align: center;*/
width: 100%;
}
@media screen and (max-width: 480px) {
.body_photo {
}
.body_img{
height: 350px; /*500*/
object-fit: cover;
}
}
@media screen and (min-width: 551px) {
.body_photo {
}
.body_img{
/*object-fit: cover;*/
/*object-position: 0px 5px;*/
height: 580px; /*500*/
object-fit: cover;
}
}
.top_photo_index{
position:absolute;
margin-top: -18%;
width: 60%;
left:20%;
font-family:"Monotype Corsiva", serif;
text-shadow:-1px -1px 3px darkslategray;
color: white;
/*border:5px solid green;*/
}
@media screen and (max-width: 550px) {
.top_photo_index {
margin-top: -50%;
width: 98%;
font-size: 30px;
left:2%;
}
}
@media screen and (min-width: 551px) {
.top_photo_index {
font-size: 3.5vw;
}
}
.home_base{
width:100%;
height:100%; /*100%*/
left:0%;
background-color: white;
/*border:5px solid green;*/
}
@media screen and (max-width: 550px) {
.home_base {
}
}
@media screen and (min-width: 551px) {
.home_base {
}
}
.baseber{
width:100%;
height: 50px;
left:0%;
/*border: 1px solid black;*/
}
.baseber > .ber_img{
display: inline-block;
text-align: center;
width: 100%;
}
@media screen and (max-width: 550px) {
.baseber {
top:3%;
}
.ber_img{
height:15%;
}
}
@media screen and (min-width: 551px) {
.baseber {
}
.ber_img{
height:15%;
}
}
.info_f1 {
/*position: absolute;*/
/*margin: 15px ;*/
width: 80%;
height:auto;
left: 20%;
font-family:"Monotype Corsiva", serif;
text-align: center;
/*font-style:oblique;*/
color:green;
/*border:1px solid brown;*/
}
@media screen and (max-width: 550px) {
.info_f1 {
top: 1.5%;
font-size: 17px;
color:green;
font-family:"KaiTi", serif;
}
}
@media screen and (min-width: 551px) {
.info_f1 {
font-size: 1.5vw;
}
}
.info_f2 {
/*position: absolute;*/
/*margin: 15px ;*/
width: 80%;
height:auto;
left: 20%;
font-family:"Monotype Corsiva", serif;
text-align: center;
/*font-style:oblique;*/
color:green;
/*border:1px solid blue;*/
}
@media screen and (max-width: 550px) {
.info_f2 {
width: 76%;
font-size: 17px;
color:green;
font-family:"KaiTi", serif;
}
}
@media screen and (min-width: 551px) {
.info_f2 {
font-size: 1.5vw;
}
}
.snsmain1 {
margin-top: 50px;
width: 99%;
height: auto;
/*border: 1px solid blue;*/
}
@media screen and (max-width: 550px) {
.snsmain1 {
margin-top: 35px;
}
}
@media screen and (min-width: 551px) {
.snsmain1 {
/*background: linear-gradient(#efffef, #f7ffef, #e7e7e7);*/
/*background: linear-gradient(45deg, #000000, #e7e7e7);*/
}
}
.snsboxtop{
width: 90%;
height: auto;
font-family:"Monotype Corsiva", serif;
/*font-style:oblique;*/
font-size: 2.0vw;
font-weight: 500;
color: darkslategray;
/*border: 3px solid red;*/
}
@media screen and (max-width: 550px) {
.snsboxtop {
width: 98%; font-weight: 400;
}
}
@media screen and (min-width: 551px) {
.snsboxtop {
}
}
.inbox3a {
width: 20%;
border-bottom: solid 2px #3c6d49;
height: auto;
font-size: 4.0vw;
/*border: 3px solid pink;*/
}
@media screen and (max-width: 550px) {
.inbox3a {
width: 20%;
font-size: 5.5vw;
}
}
@media screen and (min-width: 551px) {
.inbox3a {
}
}
.inbox3b {
margin-top: 30px;
width: 70%;
height: auto;
left:50%;
font-family:"Monotype Corsiva", serif;
text-align: center;
/*font-style:oblique;*/
font-size: 1.2vw;
color: darkslategray;
/*border: 3px solid pink;*/
}
@media screen and (max-width: 550px) {
.inbox3b {
width: 80%;
margin-top: 25px;
font-size: 3.4vw;
}
}
@media screen and (min-width: 551px) {
.inbox3b {
}
}
.inbox3c {
padding: 5px 25px;
width: 100%;
height: auto;
left:50%;
font-family:"Monotype Corsiva", serif;
text-align: left;
margin-left: 1em;
text-indent:-2em;
line-height: 2;
/*font-style:oblique;*/
font-size: 1.1vw;
font-weight: 500;
color: darkslategray;
/*border: 3px solid pink;*/
}
@media screen and (max-width: 550px) {
.inbox3c {
margin-top: 10px;
width: 97%;
padding: 5px 1px;
left:10%;
font-size: 4.0vw;
font-weight: 500; text-align: left;
}
}
@media screen and (min-width: 551px) {
.inbox3c {
}
}
.inbox3c1 {
width: 98%;
height: auto;
left:50%;
font-family:"Monotype Corsiva", serif;
text-align: center;
/*font-style:oblique;*/
font-size: 1.2vw;
color: darkslategray;
background: #eee;
/*border: 3px solid green;*/
}
@media screen and (max-width: 550px) {
.inbox3c1 {
width: 90%;
padding: 3px;
font-size: 4.0vw;
}
}
@media screen and (min-width: 551px) {
.inbox3c1 {
}
}
.snsbox4 {
margin-top: 20px;
width: 90%;
height: auto;
/*border: 3px solid red;*/
}
@media screen and (max-width: 550px) {
.snsbox4 {
margin-top: 50px;
width: 100%;
}
}
@media screen and (min-width: 551px) {
.snsbox4 {
}
}
.snsbox4a {
display: inline-block;
vertical-align: top;
margin-top: 50px;
width: 47%;
height: auto;
background-color: #483d8b;
/*border: 1px solid red;*/
}
@media screen and (max-width: 550px) {
.snsbox4a {
margin-top: 50px;
width: 100%;
}
}
@media screen and (min-width: 551px) {
.snsbox4a {
}
}
.snsbox4b {
display: inline-block;
margin-top: 50px;
width: 95%;
height: auto;
/*border: 3px solid red;*/
}
@media screen and (max-width: 550px) {
.snsbox4b {
margin-top:30px;
width: 98%;
}
}
@media screen and (min-width: 551px) {
.snsbox4b {
}
}
.snsbox4b1 {
display: inline-block;
position: absolute;
width: 45%;
height: auto;
border: 3px solid yellow;*/
}
@media screen and (max-width: 550px) {
.snsbox4b1 {
margin-top: 100px;
width: 100%;
}
}
@media screen and (min-width: 551px) {
.snsbox4b1 {
}
}
.inphoto4_1 {
display: inline-block;
padding: 50px 0px;
width: 45%;
height: auto;
border: 5px solid black;*/
}
@media screen and (max-width: 550px) {
.inphoto4_1 {
width: 98%;
}
}
@media screen and (min-width: 551px) {
.inphoto4_1 {
}
}
.snsphoto1 {
margin-top: 30px;
width: 100%;
height: auto;
/*border: 5px solid green;*/
}
.snsphoto1 > .snsphoto1_img{
/*display: inline-block;*/
text-align: left;
width: 100%;
}
@media screen and (max-width: 550px) {
.snsphoto1 {
width: 100%;
}
.snsphoto1_img{
}
}
@media screen and (min-width: 551px) {
.snsphoto1 {
width: 95%;
}
.snsphoto1_img{
/*border-radius: 10px;*/
}
}
.snsbox5 {
display: inline-block;
margin-top: 25px;
width:47%;
height: auto;
background: #fffbe6;
/*border: 3px solid blue;*/
}
@media screen and (max-width: 550px) {
.snsbox5 {
width: 100%;
}
}
@media screen and (min-width: 551px) {
.snsbox5 {
}
}
.info5a {
/*padding: 40px 0px 30px 0px;*/
display: inline-block;
margin-top: 2px;
width: 95%;
height: auto;
font-family:"Monotype Corsiva", serif;
text-align: center;
font-style:oblique;
font-size: 2.5vw;
font-weight: 600;
/*color: darkslategray;*/
color: #202f55;*/
border: 1px solid blue;*/
}
@media screen and (max-width: 550px) {
.info5a {
margin-top: 20px;
margin-left: 2px;
width: 75%;
font-size: 5.8vw;
}
}
@media screen and (min-width: 551px) {
.info5a {
}
}
.p{
text-align: center;
margin: 10px 0;
font-size:6.8vw;
}
@media screen and (max-width: 550px) {
.p {
margin-top: 20px;
width: 100%;
font-size: 6.0vw;
line-height:25px;
}
}
@media screen and (min-width: 551px) {
.p {
}
}
/*========= 1文字ずつ出現させるためのCSS ===============*/
.sboxmo2 span{
opacity: 0;
}
.sboxmo2.appeartext span{ animation:text_anime_on 2s ease-out forwards; }
@keyframes text_anime_on {
0% {opacity:0;}
100% {opacity:1;}
/*5% {opacity:0;}
80% {opacity:1;}*/
}
.p1{
text-align: center;
margin: 10px 0;
font-size:6.8vw;
}
@media screen and (max-width: 550px) {
.p1 {
margin-top: 20px;
width: 90%;
font-size: 6.0vw;
line-height:25px;
}
}
@media screen and (min-width: 551px) {
.p1 {
}
}
/*========= 1文字ずつ出現させるためのCSS ===============*/
.sboxmo1 span{
opacity: 0;
}
.sboxmo1.appeartext span{ animation:text_anime_on 2s ease-out forwards; }
@keyframes text_anime_on {
0% {opacity:0;}
100% {opacity:1;}
/*5% {opacity:0;}
80% {opacity:1;}*/
}
.info5b {
/*padding: 50px 10px;*/
display: inline-block;
width: 92%;
height: auto;
font-family:"Monotype Corsiva", serif;
text-align: left;
font-style:oblique;
font-size: 2.2vw;
color: green;
border: 2px solid darkslategray;*/
}
@media screen and (max-width: 550px) {
.info5b {
}
}
@media screen and (min-width: 551px) {
.info5b {
}
}
.info5b1 {
/*padding: 50px 10px;*/
display: inline-block;
width: 92%;
height: auto;
font-family:"Monotype Corsiva", serif;
text-align: center;
font-style:oblique;
font-size: 1.7vw;
color: #622d18;
/*border: 1px solid darkslategray;*/
}
@media screen and (max-width: 550px) {
.info5b1 {
}
}
@media screen and (min-width: 551px) {
.info5b1 {
}
}
.infobox5 {
display: inline-block;
margin-top:25px;
width:46%;
height: auto;
color: darkslategray;
font-family:"Monotype Corsiva", serif;
font-style:oblique;*/
font-size: 1.1vw;
/*border: 3px solid red;*/
}
@media screen and (max-width: 550px) {
.infobox5 {
width: 100%;
}
}
@media screen and (min-width: 551px) {
.infobox5 {
}
}
.inbox5a {
width: 90%;
height: auto;
font-family:"游ゴシック", serif;
color: darkslategray;
letter-spacing: 0.08em;
font-size: 1.05vw;
display: inline-block;
/*border: 1px solid blue;*/
}
@media screen and (max-width: 550px) {
.inbox5a {
font-size: 3.5vw;
width: 80%;
}
}
@media screen and (min-width: 551px) {
.inbox5a {
}
}
.inphoto5 {
width: 40%;
height: auto;
padding: 10px ;
display: inline-block;
font-family:"Monotype Corsiva", serif;
text-align: left;
font-style:oblique;
font-size: 2.2vw;
color: green;
/*border: 3px solid yellow;*/
}
.inphoto5 > .inphoto5_img{
/*display: inline-block;*/
text-align: left;
width: 100%;
}
@media screen and (max-width: 550px) {
.inphoto5 {
margin-top: 50px;
width: 95%;
}
.inphoto5_img{
}
}
@media screen and (min-width: 551px) {
.inphoto5 {
width: 40%;
}
.inphoto5_img{
border-radius: 20px;
}
}
.frame1 {
width: 100%;
overflow: hidden;
/*border:1px solid red;*/
}
@media screen and (max-width: 550px) {
.frame1 {
}
}
@media screen and (min-width: 551px) {
.frame1 {
}
}
.photo1a,.photo2a,.photo3a,.photo4a {
position: absolute;
width: 18%;
height: auto;
}
.photo1a img,.photo2a img,.photo3a img,.photo4a img {
opacity:0;
border-radius: 10px;
-moz-animation: imgTrans 16s infinite;
-webkit-animation: imgTrans 16s infinite;
animation: imgTrans 16s infinite;
}
.photo1a img {
-moz-animation-delay: 0s;
-webkit-animation-delay: 0s;
animation-delay: 0s;
}
.photo2a img {
-moz-animation-delay: 4s;
-webkit-animation-delay: 4s;
animation-delay: 4s;
}
.photo3a img {
-moz-animation-delay: 8s;
-webkit-animation-delay: 8s;
animation-delay: 8s;
}
.photo4a img {
-moz-animation-delay:12s;
-webkit-animation-delay: 12s;
animation-delay: 12s;
}
@-webkit-keyframes imgTrans {
0% { opacity:0; }
5% { opacity:1; }
40% { opacity:1; }
50% { opacity:0; }
100% { opacity:0; }
}
@-moz-keyframes imgTrans {
0% { opacity:0; }
5% { opacity:1; }
40% { opacity:1; }
50% { opacity:0; }
100% { opacity:0; }
}
@keyframes imgTrans {
0% { opacity:0; }
5% { opacity:1; }
40% { opacity:1; }
50% { opacity:0; }
100% { opacity:0; }
}
.photo1a,.photo2a,.photo3a,.photo4a {
position: absolute;
width: 18%;
height: auto;
}
.photo1a img,.photo2a img,.photo3a img,.photo4a img {
opacity:0;
border-radius: 10px;
-moz-animation: imgTrans 16s infinite;
-webkit-animation: imgTrans 16s infinite;
animation: imgTrans 16s infinite;
}
.photo1a img {
-moz-animation-delay: 0s;
-webkit-animation-delay: 0s;
animation-delay: 0s;
}
.photo2a img {
-moz-animation-delay: 4s;
-webkit-animation-delay: 4s;
animation-delay: 4s;
}
.photo3a img {
-moz-animation-delay: 8s;
-webkit-animation-delay: 8s;
animation-delay: 8s;
}
.photo4a img {
-moz-animation-delay:12s;
-webkit-animation-delay: 12s;
animation-delay: 12s;
}
@-webkit-keyframes imgTrans {
0% { opacity:0; }
5% { opacity:1; }
40% { opacity:1; }
50% { opacity:0; }
100% { opacity:0; }
}
@-moz-keyframes imgTrans {
0% { opacity:0; }
5% { opacity:1; }
40% { opacity:1; }
50% { opacity:0; }
100% { opacity:0; }
}
@keyframes imgTrans {
0% { opacity:0; }
5% { opacity:1; }
40% { opacity:1; }
50% { opacity:0; }
100% { opacity:0; }
}
.snsbox4d2 {
display: inline-block;
margin-top: 2%;
width: 100%;
height: auto;
background-color: white;
/*border: 3px solid black;*/
}
@media screen and (max-width: 550px) {
.snsbox4d2 {
margin-top: 20px;
width: 100%;
}
}
@media screen and (min-width: 551px) {
.snsbox4d2 {
}
}
.snsbox4d2a {
display: inline-block;
padding: 10px 0px;
width: 40%;
height: auto;
font-family:"Monotype Corsiva", serif;
text-align: left;
font-style:oblique;
font-size: 2.2vw;
color: green;
/*border: 3px solid pink;*/
}
.snsbox4d2a > .snsbox4d2a_img{
/*display: inline-block;*/
text-align: left;
margin-left: 0px;
width: 100%;
transition: 1s;
}
@media screen and (max-width: 550px) {
.snsbox4d2a {
margin-left: 20px;
width: 55%;
}
.snsbox4d2a_img{
}
}
@media screen and (min-width: 551px) {
.snsbox4d2a {
}
.snsbox4d2a_img:hover{
transform: scale(1.1);
}
}
.snsbox4d2ab {
display: inline-block;
padding: 10px 0px;
width: 40%;
height: auto;
font-family:"Monotype Corsiva", serif;
text-align: left;
font-style:oblique;
font-size: 2.2vw;
color: green;
/*border: 3px solid pink;*/
}
.snsbox4d2ab > .snsbox4d2ab_img{
/*display: inline-block;*/
text-align: left;
margin-left: 0px;
width: 80%;
transition: 1s;
}
@media screen and (max-width: 550px) {
.snsbox4d2ab {
margin-left: 20px;
width: 55%;
}
.snsbox4d2ab_img{
}
}
@media screen and (min-width: 551px) {
.snsbox4d2ab {
}
.snsbox4d2ab_img:hover{
transform: scale(1.1);
}
}
.snsbox4d2b {
/*padding: 40px 0px 30px 0px;*/
margin: 10px 0px 10px 0px;
display: inline-block;
width: 50%;
height: auto;
font-family:"Monotype Corsiva", serif;
text-align: center;
/*font-style:oblique;*/
font-size: 1.0vw;
font-weight: 400;
color: darkslategray;
background-color: #eee;
/*border: 1px solid blue;*/
}
@media screen and (max-width: 550px) {
.snsbox4d2b {
width: 100%;
font-size: 12px;
}
}
@media screen and (min-width: 551px) {
.snsbox4d2b {
}
}
.snsbox4d2b1 {
/*padding: 40px 0px 30px 0px;*/
display: inline-block;
margin: 10px 0px 10px 0px;
width: 80%;
height: auto;
font-family:"Monotype Corsiva", serif;
text-align: center;
font-style:oblique;
font-size: 1.6vw;
font-weight: 700
color: darkslategray;
border-bottom: solid 3px #3c6d49;*/
/*color: darkslategray;*/
/* border: 1px solid blue;*/
}
@media screen and (max-width: 550px) {
.snsbox4d2b1 {
width: 85%;
font-size: 7.0vw;
}
}
@media screen and (min-width: 551px) {
.snsbox4d2b1 {
}
}
.snsbox4d2b2 {
display: inline-block;
padding: 0px 3px 3px 0px;*/
width: 30%;
height: auto;
font-family:"Monotype Corsiva", serif;
text-align: center;
/*font-style:oblique;*/
font-size: 1.0vw;
font-weight: 400;
color: darkslategray;
/*border: 5px solid blue;*/
}
@media screen and (max-width: 550px) {
.snsbox4d2b2 {
width: 28%;
font-size: 3.8vw;
}
}
@media screen and (min-width: 551px) {
.snsbox4d2b2 {
}
}
.snsbox4d2b3 {
/*padding: 40px 0px 30px 0px;*/
display: inline-block;
width: 67%;
height: auto;
font-family:"Monotype Corsiva", serif;
text-align: left;
/*font-style:oblique;*/
font-size: 1.0vw;
font-weight: 400;
color: darkslategray; /*background-color:#bdb76b;*/
/*border: 1px solid blue;*/
}
@media screen and (max-width: 550px) {
.snsbox4d2b3 {
width: 55%;
font-size: 3.8vw;
}
}
@media screen and (min-width: 551px) {
.snsbox4d2b3 {
}
}
.snsbox4d1 {
display: inline-block;
margin-left: 40%;
width: 52%;
height: auto;
background-color: white;
/*border: 1px solid red;*/
}
@media screen and (max-width: 550px) {
.snsbox4d1 {
margin-top: 250px;
width: 95%;
margin-left: 0%;
}
}
@media screen and (min-width: 551px) {
.snsbox4d1 {
}
}
.snsbox4d1_2 {
display: inline-block;
margin-left: 0px;
width: 100%;
height: auto;
background-color: white;
/*border: 5px solid red;*/
}
@media screen and (max-width: 550px) {
.snsbox4d1_2 {
margin-top: 0px;
width: 95%;
margin-left: 0%;
}
}
@media screen and (min-width: 551px) {
.snsbox4d1_2 {
}
}
.inphoto4a1 {
display: inline-block;
width: 80%;
height: auto;
overflow: hidden;
/*border: 3px solid pink;*/
}
.inphoto4a1 > .inphoto4a1_img{
/*display: inline-block;*/
width: 90%;
transition: 1s;
}
@media screen and (max-width: 550px) {
.inphoto4a1 {
margin-top: 25px;
width: 100%;
}
.inphoto4a1_img{
width: 100%;
}
}
@media screen and (min-width: 551px) {
.inphoto4a1 {
}
.inphoto4a1_img:hover{
transform: scale(1.1);
}
}
.inphoto4b2 {
display: inline-block;
margin-top: 2%;
width: 100%;
height: auto;
/*border: 3px solid black;*/
}
@media screen and (max-width: 550px) {
.inphoto4b2 {
margin-top: 10px;
width: 100%;
}
}
@media screen and (min-width: 551px) {
.inphoto4b2 {
}
}
.inphoto4b2a {
display: inline-block;
width: 46%;
height: auto;
overflow: hidden;
/*border: 3px solid pink;*/
}
.inphoto4b2a > .inphoto4b2a_img{
/*display: inline-block;*/
width: 90%;
transition: 1s;
}
@media screen and (max-width: 550px) {
.inphoto4b2a {
margin-top: 25px;
width: 100%;
}
.inphoto4b2a_img{
width: 100%;
}
}
@media screen and (min-width: 551px) {
.inphoto4b2a {
}
.inphoto4b2a_img:hover{
transform: scale(1.1);
}
}
.inphoto4b2c {
display: inline-block;
margin-top: 5px;
width: 44%;
height: auto;
overflow: hidden;
/*border: 3px solid pink;*/
}
.inphoto4b2c > .inphoto4b2c_img{
/*display: inline-block;*/
margin-left: 20px;
width: 70%;
transition: 1s;
}
@media screen and (max-width: 550px) {
.inphoto4b2c {
width: 70%;
}
.inphoto4b2c_img{
margin-left: 10px;
}
}
@media screen and (min-width: 551px) {
.inphoto4b2c {
}
.inphoto4b2c_img:hover{
transform: scale(1.1);
}
}
.inphoto4b2b {
/*padding: 40px 0px 30px 0px;*/
margin: 10px 0px 10px 0px;
display: inline-block;
width: 90%;
height: auto;
font-family:"Monotype Corsiva", serif;
text-align: center;
/*font-style:oblique;*/
font-size: 1.0vw;
font-weight: 400;
color: darkslategray;
background-color: #eee;
/*border: 1px solid blue;*/
}
@media screen and (max-width: 550px) {
.inphoto4b2b {
width: 100%;
font-size: 12px;
}
}
@media screen and (min-width: 551px) {
.inphoto4b2b {
}
}
.inphoto4b2b2a {
/*padding: 0px 30px 30px 0px;*/
/*margin: 10px 0px 10px 0px;*/
display: inline-block;
width:38%;
height: auto;
font-family:"Monotype Corsiva", serif;
text-align: center;
/*font-style:oblique;*/
font-size: 1.0vw;
font-weight: 400;
color: darkslategray;
/*border: 1px solid gray;*/
}
@media screen and (max-width: 550px) {
.inphoto4b2b2a {
width: 100%;
font-size: 12px;
}
}
@media screen and (min-width: 551px) {
.inphoto4b2b2a {
}
}
.inphoto4b2b2b {
/*padding: 40px 0px 30px 0px;*/
margin: 10px 0px 10px 0px;
display: inline-block;
width:59%;
height: auto;
font-family:"Monotype Corsiva", serif;
text-align: left;
/*font-style:oblique;*/
font-size: 1.0vw;
font-weight: 400;
color: darkslategray;
/*border: 1px solid blue;*/
}
@media screen and (max-width: 550px) {
.inphoto4b2b2b {
width: 63%;
font-size: 3.8vw;
}
}
@media screen and (min-width: 551px) {
.inphoto4b2b2b {
}
}
.snsbox4a1 {
display: inline-block;
margin: 100px 0px 50px 0px;
width: 95%;
height: auto;
/*border: 3px solid yellow;*/
}
@media screen and (max-width: 550px) {
.snsbox4a1 {
margin-top: 10px;
}
}
@media screen and (min-width: 551px) {
.snsbox4a1 {
}
}
.inphoto4a2 {
display: inline-block;
width: 45%;
margin-left: 0px;
height: auto; background-color: #eee;
/*border: 5px solid green;*/
}
@media screen and (max-width: 550px) {
.inphoto4a2 {
margin-top:5px;
width: 100%;
}
}
@media screen and (min-width: 551px) {
.inphoto4a2 {
}
}
.inbox5a3b {
display: inline-block;
margin-top: 10px;
margin-left: 10px;
width: 39%;
height: auto;
font-family:"游ゴシック", serif;
color: white;
font-size: 1.1vw;
text-decoration: none;
/*border: 5px solid red;*/
}
@media screen and (max-width: 550px) {
.inbox5a3b {
width: 50%;
font-size: 2.9vw;
}
}
@media screen and (min-width: 551px) {
.inbox5a3b {
}
}
.inbox5a3b {
background-color: white;
}
/* マウスオーバー時の背景色 */
.inbox5a3b:hover {
background-color: gray;
opacity: 0.6;
}
.info6c1a {
position: absolute;
margin-top: 15px;
width: 15%;
margin-left:5px;
height: auto;
font-family:"Monotype Corsiva", serif;
/*font-style:oblique;*/
font-style:oblique;
font-size: 1.2vw;
font-weight: 700;
text-align: center;
color: white;
/*border: 3px solid pink;*/
}
@media screen and (max-width: 550px) {
.info6c1a {
margin-top: 5px;
margin-left:0px;
width: 45%;
font-size: 3.5vw;
}
}
@media screen and (min-width: 551px) {
.info6c1a {
}
}
.inphoto4a2_1 {
display: inline-block;
width: 45%;
margin-left: 0px;
height: auto;
background-color: #eee;
/*border: 5px solid green;*/
}
@media screen and (max-width: 550px) {
.inphoto4a2_1 {
margin-top: 20px;
width: 100%;
}
}
@media screen and (min-width: 551px) {
.inphoto4a2_1 {
}
}
.snsbox4d5 {
display: inline-block;
margin: 30px 0px 0px 0px;
width: 48%;
height: auto;
background-color: white;
border: 5px solid red;*/
}
@media screen and (max-width: 550px) {
.snsbox4d5 {
margin-top: 200px;
width: 95%;
}
}
@media screen and (min-width: 551px) {
.snsbox4d5 {
}
}
.snsbox4d1a {
display: inline-block;
margin: 30px 0px 0px 0px;
width: 70%;
height: auto;
margin-left:0%;
font-family:"Monotype Corsiva", serif;
text-align: center;
/*font-style:oblique;*/
font-size: 2.5vw;
font-weight: 700;
font-style:oblique;
color: darkslategray;
/*text-shadow : 4px -1px #595959;*/
/*background-color: black;*/
/*border: 3px solid blue;*/
}
@media screen and (max-width: 550px) {
.snsbox4d1a {
margin-top: 40px;
width: 80%; font-size: 2.3vw;
}
}
@media screen and (min-width: 551px) {
.snsbox4d1a {
}
}
.text {
margin-bottom: 150px;
}
.element {
/* 最初は非表示 */
transform: translateY(150px);
opacity: 0;
visibility: hidden;
transition: transform 1s, opacity 1s, visibility 1s;
/* （装飾用スタイル） */
width:100%;
height: auto;
background-color: white;
}
/* フェードイン時に入るクラス */
.is-fadein {
transform: translateX(0);
opacity: 1;
visibility: visible;
}
.title {
display: inline-block;
margin: 30px 0px 0px 0px;
width: 40%;
height: auto;
margin-left: 50%;
font-family:"Monotype Corsiva", serif;
text-align: center;
/*font-style:oblique;*/
font-size: 2.5vw;
font-weight: 700;
font-style:oblique;
color: darkslategray;
/*text-shadow : 4px -1px #595959;*/
background-color: black;
border: 3px solid pink;*/
}
@media screen and (max-width: 550px) {
.title {
margin-top: 0px;
width: 35%;
}
}
@media screen and (min-width: 551px) {
.title {
}
}
.snsbox4d1a1 {
/*background-image: -webkit-linear-gradient(315deg, #b8751e 0%, #ffce08 37%, #fefeb2 47%, #fafad6 50%, #fefeb2 53%, #e1ce08 63%, #b8751e 100%);/* 背景色にグラデーションを指定 */
/*background-image: linear-gradient(135deg, #b8751e 0%, #ffce08 37%, #fefeb2 47%, #fafad6 50%, #fefeb2 53%, #e1ce08 63%, #b8751e 100%);*/
/*-webkit-background-clip: text;/* テキストで切り抜く */
/*-webkit-text-fill-color: transparent; 切り抜いた部分は背景を表示 */
color: darkslategray;
}
@media screen and (max-width: 550px) {
.snsbox4d1a1 {
width: 90%;
margin-top: 25px;
font-size: 6.5vw;
}
}
@media screen and (min-width: 551px) {
.snsbox4d1a1 {
}
}
.snsbox4d1b {
display: inline-block;
margin-top: 20px;
width: 70%;
height: auto;
/*text-shadow : 4px -1px #595959;*/
/*border: 3px solid blue;*/
}
.snsbox4d1b > .snsbox4d1b_img{
/*display: inline-block;*/
text-align: left;
margin-left: 0px;
width: 70%;
transition: 1s;
}
@media screen and (max-width: 550px) {
.snsbox4d1b {
margin-top: 20px;
width: 80%;
font-size: 3.5vw;
}
}
@media screen and (min-width: 551px) {
.snsbox4d1b {
}
}
.snsbox4d1b1 {
display: inline-block;
padding: 50px 0px 0px 5px;
width: 25%;
height: auto;
text-align: left;
/*text-shadow : 4px -1px #595959;*/
/*border: 3px solid blue;*/
}
.snsbox4d1b1 > .snsbox4d1b1_img{
/*display: inline-block;*/
text-align: left;
margin-left: 0px;
width: 80%;
transition: 1s;
}
@media screen and (max-width: 550px) {
.snsbox4d1b1 {
width: 65%;
margin-top: 25px;
font-size: 3.5vw;
}
}
@media screen and (min-width: 551px) {
.snsbox4d1b1 {
}
}
.snsbox4d1bc {
display: inline-block;
margin-top: 20px;
width: 70%;
height: auto;
/*text-shadow : 4px -1px #595959;*/
/*border: 3px solid blue;*/
}
.snsbox4d1bc > .snsbox4d1bc_img{
/*display: inline-block;*/
text-align: left;
margin-left: 0px;
width: 70%;
transition: 1s;
}
@media screen and (max-width: 550px) {
.snsbox4d1bc {
width: 80%;
margin-top: 0px;
font-size: 3.5vw;
}
}
@media screen and (min-width: 551px) {
.snsbox4d1bc {
}
}
.inphoto4b1 {
margin: 30px 30px;
width: 80%;
height: auto;
font-family:"Monotype Corsiva", serif;
text-align: center;
/*font-style:oblique;*/
font-size: 2.0vw;
font-weight: 700;
font-style:oblique;
color: darkslategray;
/*text-shadow : 4px -1px #595959;*/
/*background-color: black;*/
/*border: 3px solid pink;*/
}
@media screen and (max-width: 550px) {
.inphoto4b1 {
width: 80%;
margin-top: 25px;
font-size: 3.5vw;
}
}
@media screen and (min-width: 551px) {
.inphoto4b1 {
}
}
.ab {
display: inline-block;
margin-top: 50px;
width: 99%;
height: auto;
font-family:"Monotype Corsiva", serif;
text-align: center;
/*font-style:oblique;*/
font-size: 2.0vw;
font-weight: 700;
font-style:oblique;
color: darkslategray;
background-color: #eee;
/*text-shadow : 4px -1px #595959;*/
/*background-color: black;*/
/*border: 3px solid red;*/
}
@media screen and (max-width: 550px) {
.ab {
width: 80%;
margin-top: 25px;
font-size: 3.5vw;
}
}
@media screen and (min-width: 551px) {
.ab {
}
}
.slide-container {
width: 100%;
margin: 20px auto;
display: flex;
align-items: center;
overflow: hidden;
background-color: #eee;
}
.slide-wrapper {
display: flex;
font-size: 1.5vw;
animation: slide-flow 20s infinite linear 1s both;
}
.slide{
width: 300px;
padding: 10px;
object-fit:cover;
border: 1px solid #eee;
}
@keyframes slide-flow {
0% {transform: translateX(0);}
100% {transform: translateX(-100%);}
}
}
.home2_2b1 {
margin-top: 100px;
width:98%;
height: auto;
display: inline-block;
/*border: 3px solid blue;*/
}
@media screen and (max-width: 550px) {
.snhome2_2b1 {
width: 100%;
}
}
@media screen and (min-width: 551px) {
.home2_2b1 {
}
}
.info_1{
width: 95%;
height: auto;
left: auto;
font-family:"Monotype Corsiva", serif;
text-align: center;
font-style:oblique;
/*border: 5px solid green;*/
}
@media screen and (max-width: 550px) {
.info_1 {
}
}
@media screen and (min-width: 551px) {
.info_1 {
}
}
.photo_w {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
visibility: hidden;
width: 100%;
height: 30vh;
}
.photo_w .photow1 {
position: relative;
visibility: visible;
overflow: hidden;
top:2%;
width: 30%;
cursor: pointer;
-webkit-transition: all 0.3s linear 0s;
transition: all 0.3s linear 0s;
background-repeat: no-repeat;
background-position: center center;
background-size: cover;
border: 5px solid white;*/
}
.photo_w .photow1:nth-child(1) {
background-image: url("21_folder/20_senmen02.png");
}
.photo_w .photow1:nth-child(2) {
background-image: url("21_folder/20_bath03.jpg");
}
.photo_w .photow1:nth-child(3) {
background-image: url("21_folder/20_Ataip.jpg");
}
.photo_w .photow1:nth-child(4) {
background-image: url('21_folder/20230819_191534 (2).jpg');
}
.photo_w .photow1:after {
position: absolute;
z-index: 2;
top: 0;
left: 0;
display: block;
width: 100%;
height: 80%;
content: '';
opacity: 0;
background-color: rgba(255,204,128 ,0.2);
}
.photo_w:hover .photow1:hover:after {
visibility: visible;
-webkit-transition: all 0.2s linear 0.4s;
transition: all 0.2s linear 0.4s;
opacity: 1;
}
.photo_w:hover .photow1:hover {
width: 35%;
}
.photo_w .photow1 .photow2 {
position: absolute;
z-index: 4;
bottom:25px;
top:20px;
left: 10px;
visibility: hidden;
max-width: 400px;
padding: 20px;
-webkit-transform: scale(0.85);
transform: scale(0.85);
color: #ffffff;
border-radius: 5px;
background-color: rgba(0,0,49,0.3);
}
.photo_w .photow1 .photow2 h2 {
font-size: 1.4em;
}
.photo_w:hover .photow1:hover .photow2 {
visibility: visible;
-webkit-transition: all 0.2s linear 0.7s;
transition: all 0.2s linear 0.7s;
-webkit-transform: scale(1);
transform: scale(1);
opacity: 1;
}
@media only screen and (max-width:551px) {
.photo_w {
height: 80px;
}
.photo_w .photow1 .photow2 h2 {
font-size: 0.9px;
}
.photo_w .photow1 .photow2 p {
font-size: 0.7px;
}
.photo_w .photow1 .photow2 {
right: 10px;
bottom: 10px;
left: 10px;
}
.photo_w:hover .photow1:hover .photow2 {
left: 10px;
}
}
.photo_wr {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
visibility: hidden;
width: 100%;
height: 30vh;
}
.photo_wr .photow1a {
position: relative;
visibility: visible;
overflow: hidden;
top:2%;
width: 30%;
cursor: pointer;
-webkit-transition: all 0.3s linear 0s;
transition: all 0.3s linear 0s;
background-repeat: no-repeat;
background-position: center center;
background-size: cover;
border: 5px solid white;*/
}
.photo_wr .photow1a:nth-child(1) {
background-image: url("21_folder/room_s1.jpg");
}
.photo_wr .photow1a:nth-child(2) {
background-image: url("21_folder/room_c.jpg");
}
.photo_wr .photow1a:nth-child(3) {
background-image: url("21_folder/23_roomjapanese.jpg");
}
.photo_wr .photow1a:nth-child(4) {
background-image: url('21_folder/DXjapanese.jpg');
}
.photo_wr .photow1a:after {
position: absolute;
z-index: 2;
top: 0;
left: 0;
display: block;
width: 100%;
height: 80%;
content: '';
opacity: 0;
background-color: rgba(255,204,128 ,0.2);
}
.photo_wr:hover .photow1a:hover:after {
visibility: visible;
-webkit-transition: all 0.2s linear 0.4s;
transition: all 0.2s linear 0.4s;
opacity: 1;
}
.photo_wr:hover .photow1a:hover {
width: 35%;
}
.photo_wr .photow1a .photow2a {
position: absolute;
z-index: 4;
bottom:25px;
top:20px;
left: 10px;
visibility: hidden;
max-width: 400px;
padding: 20px;
-webkit-transform: scale(0.85);
transform: scale(0.85);
color: #ffffff;
border-radius: 5px;
background-color: rgba(0,0,49,0.3);
}
.photo_wr .photow1a .photow2a h2 {
font-size: 1.4em;
}
.photo_wr:hover .photow1a:hover .photow2a {
visibility: visible;
-webkit-transition: all 0.2s linear 0.7s;
transition: all 0.2s linear 0.7s;
-webkit-transform: scale(1);
transform: scale(1);
opacity: 1;
}
@media only screen and (max-width:551px) {
.photo_wr {
height: 80px;
}
.photo_wr .photow1a .photow2a h2 {
font-size: 0.9px;
}
.photo_wr .photow1a .photow2a p {
font-size: 0.7px;
}
.photo_wr .photow1a .photow2a {
right: 10px;
bottom: 10px;
left: 10px;
}
.photo_wr:hover .photow1a:hover .photow2a {
left: 10px;
}
}
.snsbox8 {
margin-top: 50px;
padding: 0px 0px 50px 50px;
width: 80%;
height: auto;
left:50%;
background-color: #fffff0;
/*font-family:"Monotype Corsiva", serif;*/
/*font-style:oblique;*/
/*border: 3px solid pink;*/
}
@media screen and (max-width: 550px) {
.snsbox8 {
padding: 0px 0px 0px 0px;
}
}
@media screen and (min-width: 551px) {
.snsbox8 {
}
}
.snsbox5a {
display: inline-block;
padding: 0px;
width: 48%;
height: auto;
/*border: 3px solid pink;*/
}
@media screen and (max-width: 550px) {
.snsbox5a {
width: 98%;
}
}
@media screen and (min-width: 551px) {
.snsbox5a {
}
}
.info6 {
/*padding: 40px 0px 30px 0px;*/
display: inline-block;
width: 40%;
height: auto;
font-family:"Monotype Corsiva", serif;/
font-family:"Comic Sans MS", serif;*/
/*font-family:"Comic Sans MS", serif;*/
text-align: center;
font-style:oblique;
font-size: 2.9vw;
color: green;
background-color: #eee;
border-bottom: solid 2px #3c6d49;
/*color: darkslategray;*/
/*border: 1px solid blue;*/
}
@media screen and (max-width: 550px) {
.info6 {
width: 90%;
font-size: 8.5vw;
}
}
@media screen and (min-width: 551px) {
.info6 {
}
}
.infobox5 {
display: inline-block;
margin-top:25px;
width:47%;
height: auto;
color: darkslategray;
font-family:"游ゴシック", serif;
/*font-style:oblique;*/
font-size: 1.1vw;
/*border: 3px solid red;*/
}
@media screen and (max-width: 550px) {
.infobox5 {
width: 100%;
}
}
@media screen and (min-width: 551px) {
.infobox5 {
}
}
.inphoto5a {
margin-top: 40px;
display: inline-block;
width: 45%;
height: auto;
font-family:"Monotype Corsiva", serif;
text-align: left;
font-style:oblique;
font-size: 2.2vw;
color: green;
/*border: 3px solid yellow;*/
}
.inphoto5a > .inphoto5a_img{
/*display: inline-block;*/
text-align: left;
width: 98%;
transition: 1s;
}
@media screen and (max-width: 550px) {
.inphoto5a {
width: 80%;
}
.inphoto5a_img{
}
}
@media screen and (min-width: 551px) {
.inphoto5a {
width: 50%;
margin-right: 50px;
}
.inphoto5a_img:hover{
transform: scale(1.2);
}
}
.topgazou {
width: 100%;
height: auto;
/*border:5px solid yellow;*/
}
.topgazou > .topgazou_img{
/*display: inline-block;*/
/*text-align: center;*/
width: 100%;
}
@media screen and (max-width: 550px) {
.topgazou {
/*display: none;*/
margin-top: 100px;
width: 100%;
}
.topgazou_img{
}
}
@media screen and (min-width: 551px) {
.topgazou {
}
.topgazou_img{
/*object-fit: cover;*/ height: 295px;
}
}
.snsbox8a {
display: inline-block;
margin-top: 40px;
width: 100%;
height: auto;
/*font-family:"Monotype Corsiva", serif;*/
/*font-style:oblique;*/
/*border: 3px solid red;*/
}
@media screen and (max-width: 550px) {
.snsbox8a {
width: 98%;
}
}
@media screen and (min-width: 551px) {
.snsbox8a {
}
}
.snsphoto2infoa {
position: absolute;
margin-top: 100px;
left:20%; /*30%*/
width: 61%;
height: auto;
color: white;
/*border: 3px solid red;
/*background-color: #000;*/
/*opacity: 0.6;*/
/*border: 3px solid red;*/
}
@media screen and (max-width: 550px) {
.snsphoto2infoa {
margin-top: 50px;
width: 80%;
left: 10%;
height: auto;
object-fit: cover;*/
}
}
@media screen and (min-width: 551px) {
.snsphoto2infoa {
}
}
.snsphoto2info1a {
margin-top: 20px;
width: 65%;
height: auto;
font-family:"Comic Sans MS", serif;
font-size: 2.5vw;
color: white;
font-weight: 600;
border-bottom: solid 5px white;
/*border: 3px solid red;*/
}
@media screen and (max-width: 550px) {
.snsphoto2info1a {
margin: 20px 50px;
width: 60%;
font-size: 6.5vw;
}
}
@media screen and (min-width: 551px) {
.snsphoto2info1a {
}
}
.snsphoto2info2a {
margin-top: 2vw;
line-height: 5vw;
padding: 0px;
width: 100%;
height: auto;
text-align: center;
font-family:"游ゴシック", serif;
font-size: 1.4vw;
color: white;
font-weight: 600;
/*border: 3px solid red;*/
}
@media screen and (max-width: 550px) {
.snsphoto2info2a {
width: 80%;
font-size: 3.8vw;
}
}
@media screen and (min-width: 551px) {
.snsphoto2info2a {
}
}
.info6c1 {
position: absolute;
margin-top: 1px;
width: 35%;
height: auto;
font-family:"游ゴシック", serif;
/*font-style:oblique;*/
font-size: 1.0vw;
font-weight: 500;
text-align: center;
color: white;
/*border: 3px solid pink;*/
}
@media screen and (max-width: 550px) {
.info6c1 {
margin-top: 0px; width: 50%;
font-size: 4.0vw;
}
}
@media screen and (min-width: 551px) {
.info6c1 {
}
}
.inbox5a3c {
margin-top: 10px;
padding: 20px;
width: 40%;
height: auto;
margin-left: 25%;
font-family:"游ゴシック", serif;*/
/*font-style:oblique;*/
opacity: 0.6;
/*border: 5px solid white;*/
}
.inbox5a3c > .inbox5a3c_img{
}
.inbox5a3c_img:hover{
opacity: 0;
filter: alpha(opacity=80);
-ms-filter: "alpha( opacity=80 )";
}
@media screen and (max-width: 550px) {
.inbox5a3c {
margin-top: 5px;
margin-left:25%;
width: 100%;
}
.inbox5a3c_img{
width: 100%;
}
}
@media screen and (min-width: 551px) {
.inbox5a3c {
}
.inbox5a3c_img{
width: 100%;
/*object-position: 0 100%*/
}
}
.inbox5a1 {
margin-top: 30px;
padding: 5px 5px;
width: 65%;
height: auto;
font-family:"Monotype Corsiva", serif;
color: darkslategray;
font-size: 1.2vw;
display: inline-block;
border: 1px solid #622d18;*/
}
@media screen and (max-width: 550px) {
.inbox5a1 {
font-size: 3.9vw;
}
}
@media screen and (min-width: 551px) {
.inbox5a1 {
}
}
.sample_p5 {
overflow: hidden;
width: 100px;
height: 182px;
color: darkslategray;
text-decoration: none;
font-weight: 600;
/*border: 1px solid gray;*/
}
.sample_p5 img {
opacity: 0.9;
width: 150px;
transition: all 0.5s;
}
.sample_p5 img:hover {
opacity: 0.7;
transform: scale(1.2, 1.2);
z-index: 9999;
}
.inbox5a1 {
background-color: #faf0e6;
-webkit-transition: all 0.3s ease;
-moz-transition: all 0.3s ease;
-o-transition: all 0.3s ease;
transition: all 0.3s ease;
}
.inbox5a1:hover {
opacity: 0.6;
background-color: #eee7e0;
}
.inbox5b {
display: inline-block;
margin-top: 30px;
width: 35%;
height: 35px;
font-family:"游ゴシック", serif;
color: darkslategray;
font-size: 1.1vw;
/*border: 1px solid darkslategray;*/
}
@media screen and (max-width: 550px) {
.inbox5b {
font-size: 2.9vw;
}
}
@media screen and (min-width: 551px) {
.inbox5b {
}
}
.sample_p1 {
overflow: hidden;
width: 100px;
height: 182px;
color: darkslategray;
text-decoration: none;
font-weight: 600;
/*border: 1px solid gray;*/
}
.sample_p1 img {
opacity: 0.9;
width: 150px;
transition: all 0.5s;
}
.sample_p1 img:hover {
opacity: 0.7;
transform: scale(1.2, 1.2);
z-index: 9999;
}
.inbox5b {
background-color: white;
}
/* マウスオーバー時の背景色 */
.inbox5b:hover {
background-color: #ffc9d7;
opacity: 0.6;
}
.inbox5b {
background-color: #fffbe6;
-webkit-transition: all 0.3s ease;
-moz-transition: all 0.3s ease;
-o-transition: all 0.3s ease;
transition: all 0.3s ease;
}
.inbox5b:hover {
opacity: 0.6;
background-color: #fffbe6;
}
.home2_2b1 {
display: inline-block;
margin-top: 80px;
width:100%;
height: auto;
/*border: 3px solid blue;*/
}
@media screen and (max-width: 550px) {
.home2_2b1 {
margin-top: 30px;
width: 100%;
}
}
@media screen and (min-width: 551px) {
.home2_2b1 {
}
}
.list2b_c2a {
width: 100%;
}
.list2b_c2a ul {
list-style: none;
}
.list2b_c2a ul li p {
position: relative;
text-align: center;
width: 100%;
font-size: 21px;
font-style:oblique;
line-height:20px;
font-family:'Monotype Corsiva';
font-weight: 400;
color:#330000 ;
}
.stage {
position: relative;
overflow: hidden;
width: 99%;
background:#EEE;
/*border: 3px solid green;*/
}
@media screen and (max-width: 550px) {
.stage {
width: 100%;
}
}
@media screen and (min-width: 551px) {
.stage {
}
}
.photos {
position: absolute;
width: 100%;
top:30px;
transition:left 1s ease;
animation:transtoright0 32s linear infinite;animation-delay:1s;
}
@media screen and (max-width: 550px) {
.photos {
width: 100%;
}
}
@media screen and (min-width: 551px) {
.photos {
}
}
.pic {
width:24%;
position:absolute;
}
.pic img {
width:94%;
}
#ph1 {
left:0%;
/*border: 3px solid blue;*/
}
#ph2 {
left:25%;
}
#ph3 {
left:50%;
}
#ph4 {
left:75%;
}
#ph5 {
left:100%;
}
#ph6 {
left:125%;
}
#ph7 {
left:150%;
}
#ph8 {
left:175%;
}
#ph9 {
left:200%;
}
#ph10 {
left:225%;
}
#ph11 {
left:250%;
}
#ph12 {
left:275%;
}
#ph13 {
left:300%;
}
@keyframes transtoright0 {
0% { left:0%; }
10% { left:0%; }
12.5% { left:-25% }
22.5% { left:-25% }
25% { left:-50% }
35% { left:-50% }
37.5% { left:-75% }
47.5% { left:-75% }
50% { left:-100% }
60% { left:-100% }
62.5% { left:-125% }
72.5% { left:-125% }
75% { left:-150% }
85% { left:-150% }
87.5% { left:-175% }
97.5% { left:-175% }
99.9999% { left:-200% }
100% { left:1%; }
}
@keyframes transtoright1 {
0% { left:0%; }
10% { left:0%; }
12.5% { left:-25% }
22.5% { left:-25% }
25% { left:-50% }
35% { left:-50% }
37.5% { left:-75% }
47.5% { left:-75% }
50% { left:-100% }
60% { left:-100% }
62.5% { left:-125% }
72.5% { left:-125% }
75% { left:-150% }
85% { left:-150% }
87.5% { left:-175% }
97.5% { left:-175% }
99.9999% { left:-200% }
100% { left:1%; }
}
@keyframes transtoright2 {
0% { left:-25%; }
10% { left:-25%; }
12.5% { left:-50% }
22.5% { left:-50% }
25% { left:-75% }
35% { left:-75% }
37.5% { left:-100% }
47.5% { left:-100% }
50% { left:-125% }
60% { left:-125% }
62.5% { left:-150% }
72.5% { left:-150% }
75% { left:-175% }
85% { left:-175% }
87.4999% { left:-200% }
87.5% { left:0% }
97.5% { left:0% }
100% { left:-25%; }
}
@keyframes transtoright3 {
0% { left:-50%; }
10% { left:-50%; }
12.5% { left:-75% }
22.5% { left:-75% }
25% { left:-100% }
35% { left:-100% }
37.5% { left:-125% }
47.5% { left:-125% }
50% { left:-150% }
60% { left:-150% }
62.5% { left:-175% }
72.5% { left:-175% }
74.9999% { left:-200% }
75% { left:0% }
85% { left:0% }
87.5% { left:-25% }
97.5% { left:-25% }
100% { left:-50%; }
}
@keyframes transtoright4 {
0% { left:-75%; }
10% { left:-75%; }
12.5% { left:-100% }
22.5% { left:-100% }
25% { left:-125% }
35% { left:-125% }
37.5% { left:-150% }
47.5% { left:-150% }
50% { left:-175% }
60% { left:-175% }
62.4999% { left:-200% }
62.5% { left:0% }
72.5% { left:0% }
75% { left:-25% }
85% { left:-25% }
87.5% { left:-50% }
97.5% { left:-50% }
100% { left:-75%; }
}
@keyframes transtoright5 {
0% { left:-100%; }
10% { left:-100%; }
12.5% { left:-125% }
22.5% { left:-125% }
25% { left:-150% }
35% { left:-150% }
37.5% { left:-175% }
47.5% { left:-175% }
49.9999% { left:-200% }
50% { left:0% }
60% { left:0% }
62.5% { left:-25% }
72.5% { left:-25% }
75% { left:-50% }
85% { left:-50% }
87.5% { left:-75% }
97.5% { left:-75% }
100% { left:-100%; }
}
@keyframes transtoright6 {
0% { left:-124%; }
10% { left:-124%; }
12.5% { left:-150% }
22.5% { left:-150% }
25% { left:-175% }
35% { left:-175% }
37.4999% { left:-200% }
37.5% { left:0% }
47.5% { left:0% }
50% { left:-25% }
60% { left:-25% }
62.5% { left:-50% }
72.5% { left:-50% }
75% { left:-75% }
85% { left:-75% }
87.5% { left:-100% }
97.5% { left:-100% }
100% { left:-125%; }
}
@keyframes transtoright7 {
0% { left:-150%; }
10% { left:-150%; }
12.5% { left:-175% }
22.5% { left:-175% }
24.9999% { left:-200% }
25% { left:0% }
35% { left:0% }
37.5% { left:-25% }
47.5% { left:-25% }
50% { left:-50% }
60% { left:-50% }
62.5% { left:-75% }
72.5% { left:-75% }
75% { left:-100% }
85% { left:-100% }
87.5% { left:-125% }
97.5% { left:-125% }
100% { left:-150%; }
}
@keyframes transtoright8 {
0% { left:-175%; }
10% { left:-175%; }
12.4999% { left:-200% }
12.5% { left:0% }
22.5% { left:0% }
25% { left:-25% }
35% { left:-25% }
37.5% { left:-50% }
47.5% { left:-50% }
50% { left:-75% }
60% { left:-75% }
62.5% { left:-100% }
72.5% { left:-100% }
75% { left:-125% }
85% { left:-125% }
87.5% { left:-150% }
97.5% { left:-150% }
100% { left:-175%; }
}
.snsbox2 {
margin-top: 100px;
width: 95%;
height: auto;
color: white;
/*border: 3px solid red;*/
}
@media screen and (max-width: 550px) {
.snsbox2 {
margin-top: 50px;
width: 100%;
}
}
@media screen and (min-width: 551px) {
.snsbox2 {
}
}
.snsphoto2info {
position: absolute;
margin: 130px 390px;
padding: 15px 5px 10px 5px;
width:37%;
line-height: 2;
height: auto;
font-family:"Monotype Corsiva", serif;
font-size: 1.4vw;
font-weight: 600;
color: darkslategray;
background-color:#192f60;
opacity: 0.4;*/
/*border: 5px solid red;*/
}
@media screen and (max-width: 550px) {
.snsphoto2info {
margin: 0px 70px;
width: 60%;
font-size: 3.1vw;
}
}
@media screen and (min-width: 551px) {
.snsphoto2info {
}
}
.snsphoto2info1 {
width: 55%;
height: auto;
font-family:"Monotype Corsiva", serif;
font-size: 2.5vw;
color: white;
font-weight: 600;
font-style:oblique;
border-bottom: solid 3px white;
/*border: 3px solid red;*/
}
@media screen and (max-width: 550px) {
.snsphoto2info1 {
margin: 10px 10px;
width: 50%;
font-size:5.5vw;
}
}
@media screen and (min-width: 551px) {
.snsphoto2info1 {
}
}
.snsphoto2info2 {
margin-top: 25px;
margin-left: 20px;
width: 90%;
height: auto;
text-align: left;
/*font-family:"Monotype Corsiva", serif;*/
font-family:"Comic Sans MS", serif;
/*font-family:'Sacramento', cursive;*/
font-size: 1.1vw;
color: white;
font-weight: 400;
/*font-style:oblique;*/
/*border: 3px solid red;*/
}
@media screen and (max-width: 550px) {
.snsphoto2info2 {
margin-top: 0px;
width: 100%;
font-size: 3.0vw;
}
}
@media screen and (min-width: 551px) {
.snsphoto2info2 {
}
}
.snsphoto2info3 {
margin-top: 25px;
margin-left: 50px;
width: 90%;
height: auto;
text-align: left;
/*font-family:"Monotype Corsiva", serif;*/
font-family:"Comic Sans MS", serif;
/*font-family:'Sacramento', cursive;*/
font-size: 1.2vw;
color: white;
font-weight: 400;
/*font-style:oblique;*/
/*border: 3px solid red;*/
}
@media screen and (max-width: 550px) {
.snsphoto2info3 {
margin-top: 0px;
width: 100%;
font-size: 3.0vw;
}
}
@media screen and (min-width: 551px) {
.snsphoto2info3 {
}
}
.snsphoto2info5 {
position: absolute;
margin-top: 80px;
left:5%;
width: 29%;
height: auto;
color: white;
background-color: #000;
opacity: 0.4;*/
/*border: 3px solid red;*/
}
@media screen and (max-width: 550px) {
.snsphoto2info5 {
margin-top: 25px;
width: 80%;
left: 35px;
height: 160px;
object-fit: cover;*/
}
}
@media screen and (min-width: 551px) {
.snsphoto2info5 {
}
}
.snsphoto2 {
margin-top: 1px;
width: 100%;
height: auto;
left: 0%;
/*border: 5px solid green;*/
}
.snsphoto2 > .snsphoto2_img{
/*display: inline-block;*/
text-align: left;
width: 100%;
}
@media screen and (max-width: 550px) {
.snsphoto2 {
width: 100%;
}
.snsphoto2_img{
}
}
@media screen and (min-width: 551px) {
.snsphoto2 {
width: 100%;
}
.snsphoto2_img{
/*border-radius: 10px;*/
/*object-position: 0 50%*/
height: 400px;
object-fit: cover;*/
}
}
.snsbox3 {
width: 95%;
height: auto;
color: white;
display: inline-block;
/*border: 3px solid red;*/
}
@media screen and (max-width: 550px) {
.snsbox3 {
width: 100%;
}
}
@media screen and (min-width: 551px) {
.snsbox3 {
}
}
.insns3 {
display: inline-block;
margin-top: 100px;
vertical-align: top;
width: 47%;
height: auto;
color: green;
background: #fffbe6;
/*border: 3px solid blue;*/
}
@media screen and (max-width: 550px) {
.insns3 {
margin-top: 0px;
width: 100%;
}
}
@media screen and (min-width: 551px) {
.insns3 {
}
}
.insns3a {
display: inline-block;
margin-top: 100px;
width: 47%;
height: auto;
color: white;
background-color: #6b8e23;
/*border: 3px solid green;*/
}
@media screen and (max-width: 550px) {
.insns3a {
margin-top: 0px;
width: 100%;
}
}
@media screen and (min-width: 551px) {
.insns3a {
}
}
.insns3b {
display: inline-block;
margin-top: 10px;
width: 88%;
height: auto;
font-family:"Monotype Corsiva", serif;
text-align: center;
font-style:oblique;
font-size: 2.1vw;
font-weight: 600;
/*color: darkslategray;*/
color: green;
/*border: 3px solid yellow;*/
}
@media screen and (max-width: 550px) {
.insns3b {
margin-top: 50px;
width: 100%;
}
}
@media screen and (min-width: 551px) {
.insns3b {
}
}
.insns3b1 {
display: inline-block;
margin-top: 10px;
width: 88%;
height: auto;
font-family:"Monotype Corsiva", serif;
text-align: center;
font-style:oblique;
font-size: 2.1vw;
font-weight: 600;
/*color: darkslategray;*/
color: green;
border-bottom: solid 2px #3c6d49;
/*border: 3px solid pink;*/
}
@media screen and (max-width: 550px) {
.insns3b1 {
margin-top: 0px;
width: 50%;
}
}
@media screen and (min-width: 551px) {
.insns3b1 {
}
}
.insns3b2 {
display: inline-block;
width: 80%;
height: auto;
font-size: 15px;
color: gray;
/*border: 3px solid pink;*/
}
@media screen and (max-width: 550px) {
.insns3b2 {
margin-top: 50px;
width: 100%;
}
}
@media screen and (min-width: 551px) {
.insns3b2 {
}
}
.insns3b3 {
display: inline-block;
width: 80%;
height: auto;
font-family:"游ゴシック", serif;
font-size: 1.2vw;
/*border: 3px solid pink;*/
}
@media screen and (max-width: 550px) {
.insns3b3 {
margin-top: 50px;
width: 100%;
}
}
@media screen and (min-width: 551px) {
.insns3b3 {
}
}
.insns3c {
display: inline-block;
vertical-align: top;
padding: 5px 10px;
/*line-height: 2;*/
margin-top: 5px;
width:100%;
height: auto;
font-family:"游ゴシック", serif;
font-size: 1.1vw;
color: gray;
color: darkslategray;
/*border: 1px solid blue;*/
}
@media screen and (max-width: 550px) {
.insns3c {
margin-top: 80px;
width: 100%;
font-size: 3.9vw;
}
}
@media screen and (min-width: 551px) {
.insns3c {
}
}
.insns3c1 {
display: inline-block;
padding: 20px 20px;
margin-top: 20px;
width: 50%;
height: auto;
font-size: 15px;
color: gray;
/*border: 3px solid pink;*/
}
@media screen and (max-width: 550px) {
.insns3c1 {
margin-top: 50px;
width: 100%;
}
}
@media screen and (min-width: 551px) {
.insns3c1 {
}
}
.insns3d {
display: inline-block;
margin-top: 100px;
width: 47%;
height: auto;
color: white;
/*border: 3px solid pink;*/
}
@media screen and (max-width: 550px) {
.insns3d {
margin-top: 50px;
width: 100%;
}
}
@media screen and (min-width: 551px) {
.insns3d {
}
}
.snsbox6 {
width:100%;
height: auto;
/*border: 3px solid blue;*/
}
@media screen and (max-width: 550px) {
.snsbox6 {
margin-top: 98px;
}
}
@media screen and (min-width: 551px) {
.snsbox6 {
}
}
.inbox6a {
margin-top: 50px;
width: 60%;
font-family:"Monotype Corsiva", serif;
border-bottom: solid 2px #3c6d49;
height: auto;
font-size: 2.0vw;
background-color: #eee;
/*border: 3px solid pink;*/
}
@media screen and (max-width: 550px) {
.inbox6a {
width: 80%;
font-size: 5.5vw;
}
}
@media screen and (min-width: 551px) {
.inbox6a {
}
}
.info6a {
width: 100%;
height: auto;
font-family:"Monotype Corsiva", serif;
/*font-style:oblique;*/
font-size: 1.8vw;
font-weight: 400;*/
border-bottom: solid 5px #3c6d49;
color: darkslategray;
/*border: 3px solid red;*/
}
@media screen and (max-width: 550px) {
.info6a {
width: 100%;
}
}
@media screen and (min-width: 551px) {
.info6a {
}
}
.info6b {
margin-top: 50px;
padding: 3px;
width: 75%;
height: auto;
left:50%;
font-family:"Monotype Corsiva", serif;*/
text-align: center;
/*font-style:oblique;*/
font-size: 1.1vw;
font-weight: 400;
color: darkslategray;
/*border: 3px solid pink;*/
}
@media screen and (max-width: 550px) {
.info6b {
margin-top: 30px;
width: 74%;
font-size: 3.7vw;
}
}
@media screen and (min-width: 551px) {
.info6b {
}
}
.snsbox9 {
display: inline-block;
margin-top: 20px;
width: 90%;
height: auto;
/*border: 3px solid red;*/
}
@media screen and (max-width: 550px) {
.snsbo94 {
margin-top: 50px;
width: 100%;
}
}
@media screen and (min-width: 551px) {
.snsbox9 {
}
}
.info6b1 {
display: inline-block;
margin-top: 10px;
width: 75%;
height: auto;
left:50%;
font-family:"Monotype Corsiva", serif;*/
text-align: center;
/*font-style:oblique;*/
font-size: 1.0vw;
color: darkslategray;
/*border: 3px solid pink;*/
}
@media screen and (max-width: 550px) {
.info6b1 {
width: 100%;
}
}
@media screen and (min-width: 551px) {
.info6b1 {
}
}
.info6c {
display: inline-block;
vertical-align: top;
margin-top: 50px;
width: 40%;
height: auto;
font-family:"Monotype Corsiva", serif;
text-align: left;
/*font-style:oblique;*/
font-size: 1.1vw;
color: darkslategray;
/*border: 3px solid pink;*/
}
@media screen and (max-width: 550px) {
.info6c {
width: 100%;
}
}
@media screen and (min-width: 551px) {
.info6c {
}
}
.cre {
margin-top: 25px;
width: 100%;
height: auto;
color: darkslategray;
/*border: 3px solid green;*/
}
@media screen and (max-width: 550px) {
.cre {
width: 100%;
}
}
@media screen and (min-width: 551px) {
.cre {
}
}
.inf {
position: relative;
width: 80%;
height:auto;
text-align: right;
font-family:"KaiTi", serif;
/*border: 5px solid yellow;*/
}
@media screen and (max-width: 550px) {
.inf {
width: 100%;
margin: 30px;
}
}
@media screen and (min-width: 551px) {
.inf {
}
}
.pic-ctn {
width: 100%;
height: 42vh;
left: 10%;
/*border:5px solid blue;*/
}
@media only screen and (max-width: 550px) {
.pic-ctn {
width: 100%;
height: auto;
/*border:5px solid blue;*/
}
.pic-ctn > img {
position: absolute;
top: 0;
width: 100%;
left: calc(25% - 100px);
opacity: 0;
animation: display 10s infinite;
}
img:nth-child(2) {
animation-delay: 2s;
}
img:nth-child(3) {
animation-delay: 4s;
}
img:nth-child(4) {
animation-delay: 6s;
}
img:nth-child(5) {
animation-delay: 8s;
}
}
@media screen and (min-width: 551px) {
.pic-ctn {
}
.pic-ctn > img {
position: absolute;
top: 0;
width: 100%;
left: calc(25% - 50px);
opacity: 0;
animation: display 10s infinite;
}
img:nth-child(2) {
animation-delay: 2s;
}
img:nth-child(3) {
animation-delay: 4s;
}
img:nth-child(4) {
animation-delay: 6s;
}
img:nth-child(5) {
animation-delay: 8s;
}
}
@keyframes display {
0% {
transform: translateX(10px);
opacity: 0;
}
10% {
transform: translateX(0);
opacity: 1;
}
20% {
transform: translateX(0);
opacity: 1;
}
30% {
transform: translateX(-150px);
opacity: 0;
}
100% {
transform: translateX(-150px);
opacity: 0;
}
}
.inforoute {
/*position: absolute;*/
display: inline-block;
vertical-align: top;
margin-left: 50px;
margin-top: 50px;
width: 45%;
height:auto;
text-align: center;
font-style:oblique;*/
/*border: 1px solid red;*/
}
@media screen and (max-width: 550px) {
.inforoute {
margin-top: 300px;
margin-left: 0px;
width: 100%;
}
}
@media screen and (min-width: 551px) {
.inforoute {
}
}
.inforoute1 {
/*position: absolute;*/
display: inline-block;
margin-top: 30px;
padding: 15px;
width: 100%;
height:auto;
text-align: left;
/*font-style:oblique;*/
/*border:2px solid yellow;*/
}
@media screen and (max-width: 550px) {
.inforoute1 {
width: 100%;
padding: 5px;
}
}
@media screen and (min-width: 551px) {
.inforoute1 {
}
}
.info_f2a1 {
/*position: absolute;*/
display: inline-block;
margin-top: 20px;
width: 70%;
height:auto;
font-family:"游ゴシック", serif;
font-weight: 500;
font-size: 1.5vw;
text-align: left;
color: brown;
/*border-bottom: solid 1px #3c6d49;*/
/*font-style:oblique;*/
/*border:1px solid red;*/
}
@media screen and (max-width: 550px) {
.info_f2a1 {
margin-top: 2px;
width: 100%;
font-size: 5.2vw;
color:green;
font-family:"KaiTi", serif;
text-align: center;
}
}
@media screen and (min-width: 551px) {
.info_f2a1 {
}
}
.info_f2a {
/*position: absolute;*/
display: inline-block;
margin-top: 20px;
width: 70%;
height:auto;
font-family:"游ゴシック", serif;
font-size: 1.2vw;
text-align: left;
color: brown;
/*border-bottom: solid 1px #3c6d49;*/
/*font-style:oblique;*/
/*border:1px solid red;*/
}
@media screen and (max-width: 550px) {
.info_f2a {
margin-top: 50px;
width: 100%;
font-size: 17px;
color:green;
font-family:"KaiTi", serif;
text-align: center;
}
}
@media screen and (min-width: 551px) {
.info_f2a {
}
}
.info_f2a {
/*position: absolute;*/
display: inline-block;
margin-top: 20px;
width: 70%;
height:auto;
font-family:"游ゴシック", serif;
font-size: 1.2vw;
text-align: left;
color: brown;
/*border-bottom: solid 1px #3c6d49;*/
/*font-style:oblique;*/
/*border:1px solid red;*/
}
@media screen and (max-width: 550px) {
.info_f2a {
margin-top: 50px;
width: 100%;
font-size: 17px;
color:green;
font-family:"KaiTi", serif;
text-align: center;
}
}
@media screen and (min-width: 551px) {
.info_f2a {
}
}
.info6b3 {
margin-top: 5px;
padding: 1px;
width: 80%;
height: auto;
font-family:"Monotype Corsiva", serif;*/
text-align: center;
/*font-style:oblique;*/
font-size: 1.1vw;
font-weight: 400;
color: darkslategray;
/*border: 3px solid pink;*/
}
@media screen and (max-width: 550px) {
.info6b3 {
margin-top: 10px;
padding: 1px;
width: 92%;
font-size: 4.0vw;
}
}
@media screen and (min-width: 551px) {
.info6b3 {
}
}
.info6b3a {
margin-top: 5px;
padding: 1px;
width: 100%;
height: auto;
font-family:"Monotype Corsiva", serif;*/
text-align: center;
/*font-style:oblique;*/
font-size: 1.1vw;
font-weight: 400;
color: darkslategray;
/*border: 3px solid pink;*/
}
@media screen and (max-width: 550px) {
.info6b3a {
margin-top: 10px;
padding: 1px;
width: 92%;
font-size: 4.0vw;
}
}
@media screen and (min-width: 551px) {
.info6b3a {
}
}
.info_access {
/*position: absolute;*/
display: inline-block;
margin-top: 5px;
width: 100%;
height:auto;
font-family:"游ゴシック", serif;
font-size: 1.2vw;
text-align: left;
color: brown;
/*border-bottom: solid 1px #3c6d49;*/
/*font-style:oblique;*/
/*border:1px solid red;*/
}
@media screen and (max-width: 550px) {
.info_access {
margin-top: 5px;
padding: 5px 5px;
width: 100%;
font-size: 3.1vw;
color:green;
font-family:"KaiTi", serif;
text-align: center;
}
}
@media screen and (min-width: 551px) {
.info_access {
}
}
.info_f2b {
/*position: absolute;*/
display: inline-block;
margin-top: 5px;
padding: 10px 10px;
width: 49%;
height:auto;
font-family:"游ゴシック", serif;
font-size: 1.2vw;
text-align: center;
color: brown;
/*border-bottom: solid 1px #3c6d49;*/
/*font-style:oblique;*/
/*border:1px solid red;*/
}
@media screen and (max-width: 550px) {
.info_f2b {
margin-top: 50px;
padding: 5px 5px;
width: 100%;
font-size: 3.1vw;
color:green;
font-family:"KaiTi", serif;
text-align: center;
}
}
@media screen and (min-width: 551px) {
.info_f2b {
}
}
.info_f2b1 {
/*position: absolute;*/
display: inline-block;
margin-top: 20px;
padding: 5px 50px;
width: 55%;
height:auto;
font-family:"游ゴシック", serif;
font-size: 1.5vw;
font-weight: 500;
text-align: left;
color: #622d18;
/*border-bottom: solid 1px #3c6d49;*/
/*font-style:oblique;*/
/*border:1px solid red;*/
}
@media screen and (max-width: 550px) {
.info_f2b1 {
margin-top: 5px;
padding: 5px 5px;
width: 80%;
font-size: 5.51vw;
color:green;
font-family:"KaiTi", serif;
text-align: center;
}
}
@media screen and (min-width: 551px) {
.info_f2b1 {
}
}
.f2box2b {
display: inline-block;
width:100%;
height:auto;
text-align: center;
/*font-style:oblique;*/
/*border:1px solid green;*/
}
@media screen and (max-width: 550px) {
.f2box2b {
width:100%;
}
}
@media screen and (min-width: 551px) {
.f2box2b {
font-size: 1.5vw;
}
}
.f2box2b1 {
display: inline-block;
width:100%;
height:auto;
/*font-style:oblique;*/
/*border:1px solid green;*/
}
@media screen and (max-width: 550px) {
.f2box2b1 {
width:100%;
}
}
@media screen and (min-width: 551px) {
.f2box2b1 {
font-size: 1.5vw;
}
}
.f2box2a1 {
display: inline-block;
width: 50%;
height:auto;
text-align: center;
/*font-style:oblique;*/
/*border:2px solid blue;*/
}
@media screen and (max-width: 550px) {
.f2box2a1 {
width: 25%;
}
}
@media screen and (min-width: 551px) {
.f2box2a1 {
}
}
.f2box_2a {
display: inline-block;
vertical-align: top;
width:30%;
margin-left: 5px;
height:auto;
/*font-style:oblique;*/
/*border: 5px solid pink;*/
}
@media screen and (max-width: 550px) {
.f2box_2a {
width:45%;
}
}
@media screen and (min-width: 551px) {
.f2box_2a {
font-size: 1.5vw;
}
}
.f2box2a {
display: inline-block;
width:100%;
height:auto;
/*font-style:oblique;*/
/*border: 5px solid red;*/
}
@media screen and (max-width: 550px) {
.f2box2a {
}
}
@media screen and (min-width: 551px) {
.f2box2a {
font-size: 1.5vw;
}
}
.f2box2aa1 {
display: inline-block;
width:100%;
margin-left: 5px;
height:auto;
/*font-style:oblique;*/
/*border: 1px solid black;*/
}
@media screen and (max-width: 550px) {
.f2box2aa1 {
}
}
@media screen and (min-width: 551px) {
.f2box2aa1 {
font-size: 1.5vw;
}
}
.f2box2ab {
display: inline-block;
width:65%;
height:auto;
font-family:"KaiTi", serif;
font-weight: 500;
font-size: 1.1vw;
text-align: center;
/*font-style:oblique;*/
/*border: 1px solid red;*/
}
@media screen and (max-width: 550px) {
.f2box2ab {
width:100%;
font-size: 3.1vw;
}
}
@media screen and (min-width: 551px) {
.f2box2ab {
font-size: 1.5vw;
}
}
.f2box2a2 {
display: inline-block;
width:100%;
height:auto;
text-align: center;
/*font-style:oblique;*/
/*border: 5px solid yellow;*/
}
@media screen and (max-width: 550px) {
.f2box2a2 {
}
}
@media screen and (min-width: 551px) {
.f2box2a2 {
font-size: 1.5vw;
}
}
.snsphoto1b {
width: 100%;
height: auto;
/*border: 5px solid green;*/
}
.snsphoto1b > .snsphoto1b_img{
/*display: inline-block;*/
text-align: left;
width: 70%;
}
@media screen and (max-width: 550px) {
.snsphoto1b {
width: 100%;
}
.snsphoto1b_img{
}
}
@media screen and (min-width: 551px) {
.snsphoto1b {
width: 80%;
}
.snsphoto1b_img{
/*height: 170px;*/
/*border-radius: 50%;*/
}
}
.f2box3a1 {
display: inline-block;
width: 49%;
height:auto;
text-align: center;
/*font-style:oblique;*/
/*border:1px solid blue;*/
}
@media screen and (max-width: 550px) {
.f2box3a1 {
width: 100%;
}
}
@media screen and (min-width: 551px) {
.f2box3a1 {
font-size: 1.5vw;
}
}
.f2box3a1a {
display: inline-block;
vertical-align: top;
margin-top: 40px;
width: 15%;
height:auto;
/*font-style:oblique;*/
/*border:1px solid blue;*/
}
@media screen and (max-width: 550px) {
.f2box3a1a {
margin-top: 100px;
width: 35%;
}
}
@media screen and (min-width: 551px) {
.f2box3a1a {
font-size: 1.5vw;
}
}
.snsphoto2c {
margin-top: 1px;
width: 100%;
height: auto;
left: 0%;
/*border: 5px solid green;*/
}
.snsphoto2c > .snsphoto2c_img{
/*display: inline-block;*/
text-align: left;
width: 100%;
}
@media screen and (max-width: 550px) {
.snsphoto2c {
width: 100%;
}
.snsphoto2c_img{
}
}
@media screen and (min-width: 551px) {
.snsphoto2c {
width: 100%;
}
.snsphoto2c_img{
/*border-radius: 10px;*/
/*object-position: 0 50%*/
/*height: 400px;*/
/*object-fit: cover;*/
}
}
.snsphoto1c {
display: inline-block;
width: 100%;
height: auto;
/*border: 1px solid green;*/
}
.snsphoto1c > .snsphoto1c_img{
/*display: inline-block;*/
text-align: left;
width: 30%;
}
@media screen and (max-width: 550px) {
.snsphoto1c {
width: 100%;
}
.snsphoto1c_img{
}
}
@media screen and (min-width: 551px) {
.snsphoto1c {
width: 80%;
}
.snsphoto1c_img{
/*height: 170px;*/
/*border-radius: 50%;*/
}
}
.endobox {
margin-top: 5%;
width: 100%;
height: auto;
left:20%;
/*background: linear-gradient(#efffef, #f7ffef, #e7e7e7);*/
background: linear-gradient(#2f4f4f, #2e8b57, #e7e7e7, #fefefe);*/
border: 5px solid red;*/
}
@media screen and (max-width: 550px) {
.endobox {
}
}
@media screen and (min-width: 551px) {
.endobox {
/*background: linear-gradient(#efffef, #f7ffef, #e7e7e7);*/
/*background: linear-gradient(45deg, #000000, #e7e7e7);*/
}
}
.lastbox {
margin-top: 50px;
width: 100%;
height: auto;
left:20%;
/*background: linear-gradient(#efffef, #f7ffef, #e7e7e7);*/
background: linear-gradient(#2f4f4f, #2e8b57, #e7e7e7, #fefefe);*/
/*border: 1px solid red;*/
}
@media screen and (max-width: 550px) {
.lastbox {
}
}
@media screen and (min-width: 551px) {
.lastbox {
/*background: linear-gradient(#efffef, #f7ffef, #e7e7e7);*/
/*background: linear-gradient(45deg, #000000, #e7e7e7);*/
}
}
.cresson {
padding: 30px 0px;
width: 18%;
height: auto;
/*border:5px solid red;*/
}
.cresson > .cresson_img{
/*display: inline-block;*/
text-align: center;
width: 100%;
}
@media screen and (max-width: 550px) {
.cresson {
margin-top: 42%;
width: 90%;
left: 5%;
}
.cresson_img{
}
}
@media screen and (min-width: 551px) {
.cresson {
}
.cresson_img{
}
}
.cbox1 {
display: inline-block;
width: 90%;
height: auto;
left: 40%;
/*border: 1px solid brown;*/
}
@media screen and (max-width: 550px) {
.cbox1 {
width: 90%;
}
}
@media screen and (min-width: 551px) {
.cbox1 {
}
}
.cboxna1 {
padding: 3px;
width: 47%;
height: auto;
left: 40%;
text-align: center;
font-family:"KaiTi", serif;
font-size: 25px;
font-weight: 800;
color: white;
/*border: 5px solid brown;*/
}
@media screen and (max-width: 550px) {
.cboxna1 {
width: 100%;
}
}
@media screen and (min-width: 551px) {
.cboxna1 {
}
}
.cboxna1a {
padding: 3px;
width: 47%;
height: auto;
left: 40%;
text-align: center;
font-family:"KaiTi", serif;
font-size: 25px;
color: green;
/*border: 5px solid brown;*/
}
@media screen and (max-width: 550px) {
.cboxna1a {
width: 100%;
}
}
@media screen and (min-width: 551px) {
.cboxna1a {
}
}
.cboxna2 {
display: inline-block;
margin-top: 10px;
width: 100%;
height: auto;
color: black;
font-family:"KaiTi", serif;
/*border: 5px solid brown;*/
}
@media screen and (max-width: 550px) {
.cboxna2 {
font-size: 2.5vw;
}
}
@media screen and (min-width: 551px) {
.cboxna2 {
}
}
.cboxna3 {
display: inline-block;
width: 15%;
height: auto;
left: 40%;
font-family:"KaiTi", serif;
font-size: 1.1vw;
text-decoration: none;
color: black;
/*border: 5px solid red;*/
}
@media screen and (max-width: 550px) {
.cboxna3 {
font-size: 2.5vw;
}
}
@media screen and (min-width: 551px) {
.cboxna3 {
}
}
.cboxna4 {
display: inline-block;
width: 15%;
height: 30%;
left: 40%;
font-family:"KaiTi", serif;
font-size: 1.1vw;
/*border: 5px solid red;*/
}
@media screen and (max-width: 550px) {
.cboxna4 {
}
}
@media screen and (min-width: 551px) {
.cboxna4 {
}
}
.cbox2 {
width: 80%;
height: 30%;
left: 40%;
padding: 20px 20px;
/*border: 5px solid brown;*/
}
@media screen and (max-width: 550px) {
.cbox2 {
}
}
@media screen and (min-width: 551px) {
.cbox2 {
}
}
.cboxna5 {
display: inline-block;
width: 15%;
height: 30%;
left: 40%;
font-family:"KaiTi", serif;
font-size: 1.1vw;
/*border: 5px solid red;*/
}
@media screen and (max-width: 550px) {
.cboxna5 {
}
}
@media screen and (min-width: 551px) {
.cboxna5 {
}
}
.cbox3 {
padding: 15px;
display: inline-block;
width: 90%;
height: auto;
font-family:"Monotype Corsiva", serif;
text-align: center;
font-style:oblique;
font-size: 0.9vw;
/*border: 5px solid brown;*/
}
@media screen and (max-width: 550px) {
.cbox3 {
}
}
@media screen and (min-width: 551px) {
.cbox3 {
}
}
.sns6photo1a {
margin-top: 50px;
width: 100%;
height: auto;
display: inline-block;
background: linear-gradient(#efffef, #f7ffef, #e7e7e7);*/
border: 5px solid green;*/
}
.sns6photo1a > .sns6photo1a_img{
/*display: inline-block;*/
text-align: left;
width: 100%;
}
@media screen and (max-width: 550px) {
.sns6photo1a {
width: 100%;
}
.sns6photo1a_img{
}
}
@media screen and (min-width: 551px) {
.sns6photo1a {
}
.sns6photo1a_img{
/*object-position: 0 100%*/
height: 450px;
object-fit: cover;
}
}
.sns6photo1 {
margin-top: 50px;
width: 100%;
height: auto;
display: inline-block;
background: linear-gradient(#efffef, #f7ffef, #e7e7e7);*/
border: 5px solid green;*/
}
.sns6photo1 > .sns6photo1_img{
/*display: inline-block;*/
text-align: left;
width: 100%;
}
@media screen and (max-width: 550px) {
.sns6photo1 {
width: 100%;
}
.sns6photo1_img{
}
}
@media screen and (min-width: 551px) {
.sns6photo1 {
}
.sns6photo1_img{
/*object-position: 0 100%*/
width: 80%;
height: auto;
object-fit: cover;
}
}
.snsbox6a {
display: inline-block;
margin-top: 20px;
width: 50%;
height: auto;
left:50%;
/*font-family:"Monotype Corsiva", serif;*/
text-align: left;
/*font-style:oblique;*/
color: darkslategray;
/*background: linear-gradient(#efffef, #f7ffef, #e7e7e7);*/
border: 5px solid red;*/
}
@media screen and (max-width: 550px) {
.snsbox6a {
margin-top: 0px;
width: 100%;
}
}
@media screen and (min-width: 551px) {
.snsbox6a {
}
}
.snsbox7 {
margin-top: 20px;
width: 85%;
height: auto;
left:50%;
/*font-family:"Monotype Corsiva", serif;*/
text-align: center;
/*font-style:oblique;*/
font-size: 1.1vw;
color: darkslategray;
/*background: linear-gradient(#efffef, #f7ffef, #e7e7e7);*/
/*border: 3px solid pink;*/
}
@media screen and (max-width: 550px) {
.snsbox7 {
width: 98%;
}
}
@media screen and (min-width: 551px) {
.snsbox7 {
/*background: linear-gradient(#efffef, #f7ffef, #e7e7e7);*/
}
}
.snsbox7b {
display: inline-block;
width: 50%;
height: auto;
vertical-align: top;
margin-left: 10px;
/*font-family:"Monotype Corsiva", serif;*/
text-align: center;
/*font-style:oblique;*/
font-size: 1.1vw;
color: darkslategray;
/*background: linear-gradient(#efffef, #f7ffef, #e7e7e7);*/
/*border: 3px solid red;*/
}
@media screen and (max-width: 550px) {
.snsbox7b {
margin-top: 2px;
width: 90%;
}
}
@media screen and (min-width: 551px) {
.snsbox7b {
/*background: linear-gradient(#efffef, #f7ffef, #e7e7e7);*/
}
}
.snsbox7b1 {
display: inline-block;
margin-top: 20px;
width: 42%;
height: auto;
margin-left: 80px;
/*font-family:"Monotype Corsiva", serif;*/
text-align: center;
/*font-style:oblique;*/
font-size: 1.1vw;
color: darkslategray;
background: linear-gradient(#efffef, #f7ffef, #e7e7e7);
/*border: 3px solid green;*/
}
@media screen and (max-width: 550px) {
.snsbox7b1 {
width: 90%;
margin-left: 5px;
}
}
@media screen and (min-width: 551px) {
.snsbox7b1 {
/*background: linear-gradient(#efffef, #f7ffef, #e7e7e7);*/
}
}
.snsbox7b2 {
display: inline-block;
margin-top: 5px;
width: 100%;
height: auto;
/*font-family:"游ゴシック", serif;*/
font-family:"KaiTi", serif;
text-align: left;
margin-left: 1em;
text-indent:0em;
line-height: 2;
font-weight: 500;
/*font-style:oblique;*/
font-size: 1.2vw;
color: #622d18;
/*background: linear-gradient(#efffef, #f7ffef, #e7e7e7);*/
/*border: 3px solid green;*/
}
@media screen and (max-width: 550px) {
.snsbox7b2 {
width: 95%;
font-size: 4.0vw;
color: darkslategray;
}
}
@media screen and (min-width: 551px) {
.snsbox7b2 {
/*background: linear-gradient(#efffef, #f7ffef, #e7e7e7);*/
}
}
.snsbox_7 {
margin-top: 20px;
width: 98%;
height: auto;
left:50%;
/*font-family:"Monotype Corsiva", serif;*/
text-align: center;
/*font-style:oblique;*/
font-size: 1.1vw;
color: darkslategray;
/*background: linear-gradient(#efffef, #f7ffef, #e7e7e7);*/
/*border: 3px solid pink;*/
}
@media screen and (max-width: 550px) {
.snsbox_7 {
width: 100%;background:
}
}
@media screen and (min-width: 551px) {
.snsbox_7 {
/*background: linear-gradient(#efffef, #f7ffef, #e7e7e7);*/
}
}
.inphoto7 {
margin-top: 50px;
vertical-align: top;
width:100%;
height: auto;
/*font-family:"Monotype Corsiva", serif;*/
text-align: center;
/*font-style:oblique;*/
font-size: 1.1vw;
color: darkslategray;
border: 1px solid green;*/
}
.inphoto7 > .inphoto7_img{
/*display: inline-block;*/
text-align: left;
width: 100%;
}
@media screen and (max-width: 550px) {
.inphoto7 {
width: 100%;
margin-top: 20px;
}
.inphoto7_img{
width: 100%;
}
}
@media screen and (min-width: 551px) {
.inphoto7
{
background-color: #483d8b;
}
.inphoto7_img{
/*object-position: 0 100%*/
height: 250px;
object-fit: contain;
}
}
.schoolbox7b {
margin-top: 10px;
width: 50%;
height: auto;
left:45%;
display: inline-block;
/*font-family:"Monotype Corsiva", serif;*/
text-align: center;
vertical-align: top;
/*font-style:oblique;*/
font-size: 1.1vw;
color: darkslategray;
/*background: linear-gradient(#efffef, #f7ffef, #e7e7e7);*/
/*border: 1px solid red;*/
}
@media screen and (max-width: 550px) {
.schoolbox7b {
margin-top: 50px;
margin-left: 5px;
width: 99%;
}
}
@media screen and (min-width: 551px) {
.schoolbox7b {
}
}
.snsphoto3 {
margin-top: 30px;
width: 100%;
height: auto;
left: 0%;
/*border: 5px solid green;*/
}
.snsphoto3 > .snsphoto3_img{
/*display: inline-block;*/
text-align: left;
width: 95%;
}
@media screen and (max-width: 550px) {
.snsphoto3 {
margin-top: 50px;
width: 100%;
}
.snsphoto3_img{
}
}
@media screen and (min-width: 551px) {
.snsphoto3 {
width: 85%;
}
.snsphoto3_img{
border-radius: 0%;*/
}
}
.BBQbox7b {
padding: 15px;
margin-left: 25px;
width: 43%;
height: auto;
vertical-align: top;
display: inline-block;
/*font-family:"Monotype Corsiva", serif;*/
text-align: left;
/*font-style:oblique;*/
color: darkslategray;
font-weight: 400;
/*border: 1px solid red;*/
}
@media screen and (max-width: 550px) {
.BBQbox7b {
width: 90%;
}
}
@media screen and (min-width: 551px) {
.BBQbox7b {
}
}
.BBQbox7b1 {
margin-top: 1px;
width: 90%;
height: auto;
left:45%;
font-family:"Monotype Corsiva", serif;
margin-left: 1em;
text-indent:-2em;
line-height: 2;
/*font-style:oblique;*/
font-size: 1.0vw;
color: darkslategray;
font-weight: 400;
/*border: 1px solid blue;*/
}
@media screen and (max-width: 550px) {
.BBQbox7b1 {
width: 95%;
margin-left: 15px;
font-size: 3.5vw;
white-space: normal;
font-family:"Monotype Corsiva", serif;
}
}
@media screen and (min-width: 551px) {
.BBQbox7b1 {
}
}
.BBQbox7b2 {
margin-top: 1px;
margin-left: 50px:
height: auto;
font-family:"Monotype Corsiva", serif;
margin-left: 1em;
text-indent:-2em;
line-height: 2;
/*font-style:oblique;*/
font-size: 1.0vw;
color: darkslategray;
font-weight: 400;
/*border: 1px solid pink;*/
}
@media screen and (max-width: 550px) {
.BBQbox7b2 {
width: 95%;
margin-left: 15px;
font-size: 3.5vw;
white-space: normal;
font-family:"Monotype Corsiva", serif;
}
}
@media screen and (min-width: 551px) {
.BBQbox7b2 {
}
}
.BBQbox7b1a1 {
margin-top: 10px;
width: 100%;
height: auto;
left:45%;
font-family:"Monotype Corsiva", serif;
margin-left: 1em;
text-indent:-2em;
line-height: 2;
/*font-style:oblique;*/
font-size: 0.9vw;
font-weight: 400;
color: darkslategray;
/*border: 1px solid blue;*/
}
@media screen and (max-width: 550px) {
.BBQbox7b1a1 {
width: 93%;
margin-left: 20px;
margin-top: 5px;
font-size: 2.9vw;
white-space: normal;
font-family:"Monotype Corsiva", serif;
}
}
@media screen and (min-width: 551px) {
.BBQbox7b1a1 {
}
}
.BBQbox7b1a {
margin-top: 1px;
width: 100%;
height: auto;
left:45%;
font-family:"Monotype Corsiva", serif;
margin-left: 1em;
text-indent:-2em;
line-height: 2;
/*font-style:oblique;*/
font-size: 1.0vw;
font-weight: 400:
color: darkslategray;
/*border: 1px solid blue;*/
}
@media screen and (max-width: 550px) {
.BBQbox7b1a {
width: 91%;
margin-top: 10px;
margin-left: 20px;
font-size: 3.6vw;
white-space: normal;
font-family:"Monotype Corsiva", serif;
}
}
@media screen and (min-width: 551px) {
.BBQbox7b1a {
}
}
.BBQbox7b1ab {
margin-top: 1px;
width: 95%;
height: auto;
left:40%;
font-family:"Monotype Corsiva", serif;
margin-left: 1em;
text-indent:-2em;
line-height: 2;
font-weight: 400;
/*font-style:oblique;*/
font-size: 1.0vw;
color: darkslategray;
/*border: 1px solid blue;*/
}
@media screen and (max-width: 550px) {
.BBQbox7b1ab {
width: 65%;
margin-top: 10px;
margin-left: 80px;
font-size: 3.6vw;
white-space: normal;
font-family:"Monotype Corsiva", serif;
}
}
@media screen and (min-width: 551px) {
.BBQbox7b1ab {
}
}
.info7b {
/*padding: 50px 10px;*/
display: inline-block;
width:65%;
left:0px;
height: auto;
font-family:"Monotype Corsiva", serif;
text-align: center;
font-style:oblique;
font-size: 2.2vw;
color: green;
border-bottom: solid 5px #3c6d49;
/*border: 1px solid darkslategray;*/
}
@media screen and (max-width: 550px) {
.info7b {
width: 100%;
}
}
@media screen and (min-width: 551px) {
.info7b {
}
}
.infobox7 {
padding: 50px 2px;
width: 80%;
height: auto;
color: darkslategray;
font-family:"游ゴシック", serif;
/*font-style:oblique;*/
font-size: 1.1vw;
display: inline-block;
/*border: 3px solid red;*/
}
@media screen and (max-width: 550px) {
.infobox7 {
width: 100%;
/*background: linear-gradient(#efffef, #f7ffef, #e7e7e7);*/
}
}
@media screen and (min-width: 551px) {
.infobox7 {
}
}
.info7 {
/*padding: 40px 0px 30px 0px;*/
display: inline-block;
margin-top: 20px;
width: 58%;
margin-left:2%;
height: auto;
font-family:"Monotype Corsiva", serif;
text-align: center;
font-style:oblique;
font-weight: 500;
font-size: 1.7vw;
color: #6c272d;
/*color: darkslategray;*/
/*border: 1px solid blue;*/
}
@media screen and (max-width: 550px) {
.info7 {
padding: 15px 1px;
width: 100%;
font-size: 5.7vw;
}
}
@media screen and (min-width: 551px) {
.info7 {
}
}
.info7a {
width: 88%;
height: auto;
font-family:"Monotype Corsiva", serif;
text-align: center;
/*font-style:oblique;*/
font-size: 1.1vw;
font-weight: 600;
/*color: darkslategray;*/
color: #6c272d;*/
display: inline-block;
/*border: 1px solid blue;*/
}
@media screen and (max-width: 550px) {
.info7a {
padding: 10px 1px;
width: 88%;
font-size: 4.1vw;
}
}
@media screen and (min-width: 551px) {
.info7a {
}
}
.info7a11 {
/*padding: 40px 0px 30px 0px;*/
width: 88%;
height: auto;
font-family:"Monotype Corsiva", serif;
text-align: center;
/*font-style:oblique;*/
font-size: 0.9vw;
font-weight: 400;
/*color: darkslategray;*/
color: darkslategray;*/
display: inline-block;
/*border: 1px solid blue;*/
}
@media screen and (max-width: 550px) {
.info7a11 {
width: 100%;
font-size: 3.1vw;
}
}
@media screen and (min-width: 551px) {
.info7a11 {
}
}
.info7a2 {
/*padding: 40px 0px 30px 0px;*/
margin-top: 15px;
width: 100%;
height: auto;
font-family:"Monotype Corsiva", serif;
text-align: center;
/*font-style:oblique;*/
font-size: 1.1vw;
font-weight: 600;
/*color: darkslategray;*/
color: darkslategray;*/
display: inline-block;
/*border: 1px solid red;*/
}
@media screen and (max-width: 550px) {
.info7a2 {
padding: 50px 25px 25px 40px;
margin-left: 40px;
width: 75%;
font-size: 4.1vw;
}
}
@media screen and (min-width: 551px) {
.info7a2 {
}
}
.inbox7a {
width: 98%;
height: auto;
font-family:"Monotype Corsiva", serif;
font-weight: 400;
color: darkslategray;
font-size: 1.1vw;
display: inline-block;
/*border: 1px solid blue;*/
}
@media screen and (max-width: 550px) {
.inbox7a { font-size: 3.5vw;
}
}
@media screen and (min-width: 551px) {
.inbox7a {
}
}
.info7c {
display: inline-block;
margin-top: 20px;
width: 70%;
height: auto;
/*text-shadow : 4px -1px #595959;*/
/*border: 3px solid blue;*/
}
.info7c > .info7c_img{
/*display: inline-block;*/
text-align: left;
margin-left: 0px;
width: 70%;
transition: 1s;
}
@media screen and (max-width: 550px) {
.info7c {
margin-top: 20px;
width: 80%;
font-size: 3.5vw;
}
}
@media screen and (min-width: 551px) {
.info7c {
}
}