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


html,body{
     height:100%;
}

body{
	font-family: tbchibirgothicplusk-pro, sans-serif;
    font-weight: bold;
    font-style: normal;
}

h3{
	text-align: center;
	font-size:16px;
	font-weight: 300;
	letter-spacing: 0.1em;
	color: #ffd800;
}

.textnormal{
	font-size:18px;
}

.textl{
	font-size:20px;
}

.online{
	width: 20vw;
	height: 10vw;
	margin-left: 0 auto;
	margin-left: 40%;
	fontsize:5em;
}
.reigai1{
	letter-spacing: 0.1em;
}
.reigai2{
	letter-spacing: 0.01em;
}

/*wrap */
#wrapper {
  width:100%;
  position: relative;
  min-height: 100%;
  overflow:hidden;
}

/*スクロールバーの幅*/
::-webkit-scrollbar {
    width: 10px;
}
/*スクロールバーのレール*/
::-webkit-scrollbar-track {
  border-radius: 30px;
  background: #eee;
}
/*スクロールバーのつまみ*/
::-webkit-scrollbar-thumb {
  border-radius: 30px;
  background: #ffd800;
}


/*アニメーション　フェード*/
@keyframes fadeIn {
    0% {opacity: 0}
    100% {opacity: 1}
}

@-webkit-keyframes fadeIn {
    0% {opacity: 0}
    100% {opacity: 1}
}

/*ローディング*/
/* ローディングの背景部分のCSS */
.loader{
  background:#fff;
  height:100%;
  left:0;
  position:fixed;
  top:0;
  width:100%;
  z-index:10;
}
 
/* ローディングのアニメーション部分のCSS (https://projects.lukehaas.me/css-loaders/) */
.loader-animation,
.loader-animation:before,
.loader-animation:after {
  background:#ffd800;
  -webkit-animation:load1 1s infinite ease-in-out;
  animation:load1 1s infinite ease-in-out;
  width:1em;
  height:4em;
  border-radius: 4px;
}
.loader-animation {
  display: none;
  height:10px;
  left:50%;
  margin:-5px 0 0 -5px;
  position:absolute;
  top:50%;
  width:10px;
  color:#ffd800;
  text-indent:-9999em;
  font-size:10px;
  -webkit-transform:translateZ(0);
  -ms-transform:translateZ(0);
  transform:translateZ(0);
  -webkit-animation-delay:-0.16s;
  animation-delay:-0.16s;
}
.loader-animation:before,
.loader-animation:after {
  position:absolute;
  top:0;
  content:'';
}
.loader-animation:before {
  left:-1.5em;
  -webkit-animation-delay:-0.32s;
  animation-delay:-0.32s;
}
.loader-animation:after {
  left:1.5em;
}
@-webkit-keyframes load1 {
  0%,
  80%,
  100% {
    box-shadow:0 0;
    height:4em;
  }
  40% {
    box-shadow:0 -2em;
    height:5em;
  }
}
@keyframes load1 {
  0%,
  80%,
  100% {
    box-shadow:0 0;
    height:4em;
  }
  40% {
    box-shadow:0 -2em;
    height:5em;
  }
}

.loadpic{
	background-image: url("https://chibana.info/img/chibanasan.gif");
	background-size:contain;
	background-repeat: no-repeat;
	position: absolute;
	width: 40px;
	height: 40px;
	z-index: 60;
	top:50%;
	left:50%;
	margin-left: -15px;
	
}
/*トップ画像*/
.toppic{
	display: inline-block;
	width: 80vw;
	margin: 0 auto;
	overflow: hidden;
	min-width: 320px;
	animation: fadeIn 2s ease 0s 1 normal;
    -webkit-animation: fadeIn 2s ease 0s 1 normal;
	
}

.frame{
	position: absolute;
	background-image: url("https://chibana.info/img/chibanaframe02.png");
	background-size:contain;
	background-repeat: no-repeat;
	width: 94vw;
	height: 60vw;
    text-align: center;
	z-index:-1;
	margin-left: 1vw;
	margin-top: -10.1vw;
}
.frameunder{
	position: relative;
	background-image: url("https://chibana.info/img/chibanaframeunder02.png");
	background-size:contain;
	background-repeat: no-repeat;
	width: 80vw;
	height: 55vw;
	margin-top: -43.6vw;
	margin-left: 8vw;
    text-align: center;
	z-index:-7;
}


.main_imgbox{
	position: relative;
	margin-left: 16vw;
	margin-top: 6vw;
	width: 64vw;
	height: 38.4vw;
	z-index:-3;
	overflow: hidden;
}

.main_img {
    z-index:10;
    opacity: 0;
    width: 64vw;
    height: 38.4vw;
    background-position: center center;
    background-repeat: no-repeat;
    background-size: cover;
    position: absolute;
    left: 0;
    top: 0;
    -webkit-animation: anime 36s 0s infinite;
    animation: anime 36s 0s infinite; }


@keyframes anime {
  0% {
        opacity: 0;
    }
    8% {
        opacity: 1;
    }
    17% {
        opacity: 1;
    }
    25% {
        opacity: 0;
        transform: scale(1.2) ;
         z-index:9;
    }
    100% { opacity: 0 }
}


.main_img:nth-of-type(2) {
      -webkit-animation-delay: 6s;
      animation-delay: 6s; }

    .main_img:nth-of-type(3) {
      -webkit-animation-delay: 12s;
      animation-delay: 12s; }

    .main_img:nth-of-type(4) {
      -webkit-animation-delay: 18s;
      animation-delay: 18s; }

    .main_img:nth-of-type(5) {
      -webkit-animation-delay: 24s;
      animation-delay: 24s; }

    .main_img:nth-of-type(6) {
      -webkit-animation-delay: 30s;
      animation-delay: 30s; }

/*リンク*/
.linktext{
   margin-left:auto;
   margin-right: auto;
   width: 90vw;
	}

	
/*お知らせ*/
.osirasecontainer{
    display: flex;
	flex-direction: row;
	flex-wrap: wrap;
	justify-content: center;
	align-items: center;
	left:5vw;
	width: 95vw;
	height: 42vw;
	margin-top: 50px;
	margin-bottom: 70px;
}

.topics{
	margin-left: 12vw;
}

/*お知らせ左欄*/
.containerleft{
	height: 22vw;
	min-width: 320px;
	min-height:200px;
	background-color: none;
}
.chibanaobject{
	background-image: url("https://chibana.info/img/chibanaobject01.png");
	background-size:contain;
	background-repeat: no-repeat;
	width: 26px;
	height: 26px;
}

.osirase{
	min-width :100px;
}
.osirasemidasi{
	display: flex;
	justify-content: flex-start;
	align-items: center;
	overflow: hidden;
    text-overflow: clip;
}
.osirasetext{
	width:80vw;
	height:22vw;
	min-width: 320px;
	min-height: 200px;
	overflow-y:scroll;
	font-weight:300;
	border-top: solid 2px #ffd800;
	border-bottom: solid 2px #ffd800;
	background-color: white;
}



/*お知らせ右欄*/未使用

.sidepic{
	background-image: url("https://chibana.info/img/top_sidepic.jpg");
	background-size:cover;
	background-repeat: no-repeat;
	background-color: aliceblue;
	widh: 38vw;
	height: 23vw;
	min-width: 300px;
	min-height: 180px;
	z-index:-1;
	margin:3%;
}

.chibanaobj03{
	position: relative;
	background-image: url("https://chibana.info/img/chibanaobject03.png");
	background-size:contain;
	background-repeat: no-repeat;
	left:36vw;
	top:-4vw;
	width: 8vw;
	height: 8vw;
	z-index:4;
}

.chibanaobj04{
	position: relative;
	background-image: url("https://chibana.info/img/chibanaobject04.png");
	background-size:contain;
	background-repeat: no-repeat;
	left:-3vw;
	top:-36vw;
	width: 8vw;
	height: 8vw;
	z-index:4;
}

/*背景*/

.chibana_bg{
	position: absolute;
	background-image: url("https://chibana.info/img/cb_background.png");
	background-size:contain;
	background-repeat: no-repeat;
	width: 100vw;
	height:600px;
	z-index: -8;
	top:1000px;
}


/*フッター*/

.footer {
  position: absolute;
  bottom: 0;
}
.footercontainer{
	display: flex;
	justify-content: space-around;
	align-content: space-around;
	align-items: center;
	flex-wrap: wrap-reverse;
	margin-top: 100px;
}

.addresscontainer{
	width: 40vw;
	height: 25.5vw;
	min-width: 320px;
	min-height: 200px;
	z-index:4;
	text-align: center;
	padding-top: 50px;
}

.addressinner{
	width: 280px;
	height: 150px;
	margin: 0 auto;
	text-align: left;
}
.size2{
	font-size:20px;
	letter-spacing: 0.6em;
	line-height: 10px;
}

.size3{
	font-size:10px;
	margin-left:50px;
	font-weight: 300;
	letter-spacing: 0.6em;
	line-height: 10px;
	color: #ffd800;
}
.size4{

	color: #000;
}
.infocontainer{
	display: flex;
	flex-direction: column;
	width: 40vw;
	height: 25.5vw;
	min-width: 320px;
	min-height: 200px;
	z-index:4;
	font-size:19px;
	letter-spacing: 0.5em;
}
.topotoiawase{
	width:280px;
	height:35px;
	border:solid 3px #ffd805;
	border-radius: 10px;
	text-align: center;
	padding: 4%;
	margin: 5% auto;
	background-color: #FFD800;
	color: #000;
}
.topmap{
	width:280px;
	height:35px;
	border:solid 3px #ffd805;
	border-radius: 10px;
	text-align: center;
	padding: 4%;
	margin: 5% auto;
	background-color: #FFD800;
	color: #000;
}

.topotoiawase:hover{
	background-color: #fbefc9;
}

.topmap:hover{
	background-color: #fbefc9;
}

.footercontainer a {
		text-decoration: none;
	    line-height: 35px;
	    color:#000000;
}

.footerpic{	
	position: absolute;
	background-image: url("https://chibana.info/img/chibanafooter.png");
	background-size:contain;
	background-repeat: no-repeat;
	width:100vw;
	height: 32vw;
	z-index:-1;
	margin-top: -25vw;
	margin-bottom: 0;
}

.copyright{
	text-decoration: none;
	position: relative;
	top:0.2vw;
	width: 34vw;
	min-width: 320px;
	height: 25px;
	text-align: center;
	color: black;
	font-size:1vw;
	z-index: 10;
	margin: 0 auto;
	letter-spacing: 0.2em;
	font-weight: 200;
}

/*テキストボックス内css*/
.innnerbox{
	display: flex;
	width: 80vw;
	flex-direction: row;	
}
.innnerbox_left{
	width: 30vw;
	height:1500px;
}
.innnerbox_right{
	width: 10vw;
	height:1500px;
}


.privacytext{
	
	width:90vw;
	margin-top: 120px;
	margin-left: 25px;
	font-weight: 500;
	font-style: normal;
}

.privacyinner_st{
	width: 80vw;
}

.privacyinner_subt{
	margin-top: 20px;
	font-size: 1em;
	font-weight: 700;
	
}

.privacyinner01{
	display: flex;
	flex-direction: row;
	flex-wrap: nowrap;
	justify-content: flex-start;
	border-radius: 10px;
	background-color: antiquewhite;
	margin-top: 8px;
	padding: 8px;
}
.privacyinner02{
	font-size: 0.9em;
	width: 20vw;
	margin-top: 20px;
	
}
.privacyinner03{
	display: flex;
	flex-direction: column;
	flex-wrap:nowrap;
	margin-top: 20px;
	width: 60vw;
	font-size: 0.8em;
	border-radius: 10px;
	padding: 4px;
	background-color: beige;
}

.privacyinner04{
	display: flex;
	flex-wrap:nowrap;
	margin-top: 10px;
	width: 60vw;
	font-size: 1.2em;
	border-radius: 10px;
	padding: 4px;
	background-color: beige;
}


.priset{
	width: 80vw;
	height: auto;
	margin: 0 auto;
}

.priset2{
	width: 90vw;
	height: auto;
	margin: 0 auto;
}


@media screen and (min-width:480px){
	
.osirasecontainer{
	height: 38vw;
}
	
.footercontainer{
	margin-top: 0px;
}
	
.linktext{
   margin-left: -3vw;
   width: 98vw;
		
	}
	
}
@media screen and (min-width:660px){
	
.linktext{
   margin-left: 0vw;
		
	}
.osirasecontainer{
	height: 28vw;
	margin-top: 50px;
}

}
@media screen and (min-width:796px){
	
.osirasecontainer{
	height: 28vw;
	margin-top: 50px;
}
	
}
@media screen and (min-width:1200px){
	
.osirasecontainer{
	height: 28vw;
	margin-top: 50px;
}

}