@charset "UTF-8";
/* CSS Document */

/* -------------------------------------------- 基本 ----------------------------------------------------------------------- */

body {
    font-family: "游ゴシック体", "Yu Gothic", "YuGothic", "ヒラギノ角ゴ Pro", "Hiragino Kaku Gothic Pro", "メイリオ", "Meiryo", "MS Pゴシック", "MS PGothic", sans-serif;
	color: black;
	font-size:14.5px;
	margin: 0;
}

 
/* -------------------------------------------- トップページ ----------------------------------------------------------------------- */ 
  
/* ---- 基本　&　共通 ---- */ 
.topbody {
    margin:0;
    background-image: url(../img/top/back.jpg);
    background-position: center center;
    background-repeat: repeat;
    background-attachment: fixed;
    background-size: 800px;
    background-color:white;
	font-family: "游ゴシック体", "Yu Gothic", "YuGothic", "ヒラギノ角ゴ Pro", "Hiragino Kaku Gothic Pro", "メイリオ", "Meiryo", "MS Pゴシック", "MS PGothic", sans-serif;
    text-align: center;
    padding-bottom:100px;
}
@media screen and (max-width:751px) {
	.topbody { background-attachment: scroll; background-repeat: repeat;  background-size: 150%; }
}


.foo.delighter {
    transition: all .3s ease-in-out;
    transform: translateY(60%);
    opacity: 0;
}
@media screen and (max-width:751px) {
	.foo.delighter { transform: translateY(5%); }
}
 .foo.delighter.started {
    transform: none;
    opacity: 1;
}


/* ---- 表紙 ---- */ 
.kao {
    width:auto;
    max-width:400px;
    margin-right:0;
    margin-left:0;
    margin:auto;
}

.kao-logo {
    width:280px;
    margin-top:70px;
}
@media screen and (max-width:751px) {
    .kao-logo { width:220px; }
}

.kao-bun {
    margin-top:50px;
    text-align:center;
    font-size:17px;
    font-weight:bold;
    letter-spacing:3px;
    line-height:35px;
    /*フチ*/
    display:inline-block;
    text-shadow:
     2px  2px 1px white,
	-2px  2px 1px white,
	 2px -2px 1px white,
	-2px -2px 1px white,
	 2px  0px 1px white,
	 0px  2px 1px white,
	-2px  0px 1px white,
	 0px -2px 1px white; 
}
@media screen and (max-width:751px) {
	.kao-bun { background-color:white; font-size:15px; line-height:28px; margin-left:auto; text-align: justify; margin-left:20px; margin-right:20px; }
}



/* ---- コンテンツ ---- */ 
.con {
    position:relative;
    margin-right:0;
    margin-left:0;
    margin:auto;
    margin-top:150px;
    margin-bottom:150px;
    width:auto;
    max-width:850px;
    height:auto;
    border:solid 10px black;
    background: white;
    border-radius:30px;
}
@media screen and (max-width:751px) {
	.con { margin-top:80px; margin-bottom:80px; width:90%; }
}

.con-img {
    width:100%;
    height:auto;
    max-height:400px;
    object-fit:cover;
    border-radius:20px 20px 0 0;
}
@media screen and (max-width:751px) {
	.con-img { max-height:auto;  width:100%; height:250px; object-fit:cover; }
}

.con-img2 {
    width:60%;
    margin-top:50px;
    border-radius:20px 20px 0 0;
}
@media screen and (max-width:751px) {
	.con-img2 { width:85%; }
}

.mark {
    width:60px;
    position:absolute;
    top:50px;
    right:50px;
}
@media screen and (max-width:751px) {
	.mark { width:40px; top:20px; right:20px; }
} 

.con-title {
    font-size:30px;
    font-weight:bold;
    letter-spacing:2px;
    margin-top:25px;
    margin-bottom:0;
    padding-left:30px;
    padding-right:30px;
}
@media screen and (max-width:751px) {
	.con-title { padding-left:15px; padding-right:15px; font-size:23px; }
}
@media screen and (max-width:751px) {
	.con-title span { display:block; }
}

.con-title-b {
    font-size:25px;
    font-weight:bold;
    letter-spacing:2px;
    margin-top:15px;
    margin-bottom:0;
    padding-left:50px;
    padding-right:50px;
}
@media screen and (max-width:751px) {
	.con-title-b { padding-left:15px; padding-right:15px; font-size:20px; }
}
@media screen and (max-width:751px) {
	.con-title-b span { display:block; }
}

.con-bun {
    font-size:16px;
    padding-left:50px;
    padding-right:50px;
    padding-bottom:20px;
    margin-top:10px;
}
@media screen and (max-width:751px) {
	.con-bun { font-size:14.5px; padding-left:15px; padding-right:15px; padding-bottom:0; margin-top:20px; margin-left:auto; text-align: justify; }
}


div.con-btn{
    text-align:center;
    margin-top:30px;
    margin-bottom:-35px;
}
a.con-btn {
    display: inline-block;
    font-size:17px;
    padding: 15px 60px;
    text-decoration: none;
	color: white;
	background: black;
    border-radius: 10px;
    transition: .4s;
}
@media screen and (max-width: 751px) {
	a.con-btn { padding: 15px 50px; }
}

a.con-btn:hover {
	background:#FFA31D;
    color: white;
}

.con-maru {
    position:absolute;
    top:-60px;
    left:0;
    right:0;
    margin:auto;
    border-radius:50%;
    background-color:black;
    width:120px;
    height:120px;
}
@media screen and (max-width: 751px) {
	.con-maru { top:-45px; width:90px; height:90px; }
}

.con-maru-moji {
    text-align: center;
    color:white;
    font-size:20px;
    font-weight:bold;
    letter-spacing:4px;
    padding-top:25px;
}
@media screen and (max-width: 751px) {
	.con-maru-moji { font-size:15px; letter-spacing:4px; padding-top:18px; padding-left:5px; }
}

.con-map {
    width:100%;
    height:350px;
    border-radius:20px 20px 0 0;
}