* {
	margin: 0;
	padding: 0;
}


.cbo {
  font-family: "Cherry Bomb One", system-ui;
  font-weight: 400;
  font-style: normal;
}

.f2 { font-size: 2rem; }
.fm { font-size: 1.6rem; }
.fw { color: #ffffff; }

.fwa a,.fwa a:visited,.fwa a:hover{ color: #ffffff; }

a, a:visited {
	text-decoration: none;
	color: #007bff;
}
a:hover {
	color: #00bb5b;
}


body {
	font-family: sans-serif;
	background-color: #f8f8f8;
	background-color: #ff8888;
}



#header_bar {
	
	width: 100%;
	height: 50px;
	background-color: #ea5506;
	
	display: flex;
	align-items: flex-end;
	justify-content: space-between;
}

#site_title {
/*	
	font-size: 2rem;
	color: #ffffff;
*/	
}

#site_exp br {
	display: none;
}

#footer_bar {
	
	width: 100%;
	height: 28px;
	background-color: #ea5506;

	text-align: center;
	color: #ffffff;

}

#main_box {
	width: 1008px;
	margin: 0 auto;
	
	display: flex;
}

#left_container {
	width: 120px;
	padding-top: 200px;
}

#center_container {
	width: 768px;
	background-color: #ffe4e1;
	
	text-align: center;
}

#center_container hr {
	width: 80%;
	margin: 0 auto;
	border-color: white;
	border-width: 3px;
}


#art_title_box {
	display: flex;
	justify-content: space-between;
}



#right_container {
	width: 120px;
	padding-top: 200px;
}


#ad1_pc {
	margin: 0 auto;
	text-align: center;
}

#ad1_sp {
	display: none;
	margin: 0 auto;
	text-align: center;
}


.notice {
	font-size: 0.9rem;
	color: #a00;
}



/* -------------------------------------- PC 2段階 ------------------------------ */
@media (max-width: 1008px) {

#main_box {
	width: 888px;
}

#left_container {
	display: none;
}

}


/* -------------------------------------- PC 1段階 ------------------------------ */
@media (max-width: 888px) {

#main_box {
	width: 768px;
}

#right_container {
	display: none;
}

}


/* -------------------------------------- スマホ ------------------------------ */
@media (max-width: 768px) {

#header_bar {  }

#header_bar {
	
	text-align: center;
	height: auto;
	
}

#header_bar {
	
	display: flex;
	flex-direction: column;
	align-items: unset;
	justify-content: unset;
}

#site_exp br {
	display: inline;
}


#main_box {
	width: 100%;
}

#center_container {
	width: 100%;
}


#ad1_pc {
	display: none;
}

#ad1_sp {
	display: block;
}

#today_art img {
	width: 100%;
}




}

/* 2025-07-07追加 */
.top-bar {
  background: linear-gradient(135deg, #f0fff8, #ccffe7); /* 青白いグラデーション */
  color: black; /* 文字色を黒に */
  
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 0 1em;
  height: 2em;
}



.oshirase {
  display: flex;
  align-items: center;
}
.oshirase-label {
  margin-right: 0.5em;
  font-weight: bold;
}
.oshirase-buttons {
  display: flex;
  flex-direction: column;
  margin-right: 0.5em;
  line-height: 1em;
}
.oshirase-buttons button {
  background: none;
  border: none;
  color: black;
  font-size: 0.8em;
  cursor: pointer;
  padding: 0;
  line-height: 1em;
}
.oshirase-text {
  white-space: nowrap;
}
.sns-links a {
  display: inline-block;
  width: 1.6em;
  height: 1.6em;
  margin-left: 0.4em;
  border-radius: 50%;
  color: white;
  text-align: center;
  line-height: 1.6em;
  font-size: 1em;
  background-color: #666;
  transition: background 0.3s;
  text-decoration: none;
}
.sns-links a:hover {
  background-color: #999;
}
.sns-links .fa-x-twitter { background: black; }
.sns-links .fa-facebook-f { background: #3b5998; }
.sns-links .fa-line { background: #00c300; }
.sns-links .fa-reddit-alien { background: #ff4500; }