@charset "utf-8";

.oshirase_modal{
	margin-top: 20px;
}
.modal-open span{
	font-size: 90%;
	font-weight: 500;
	color: #333333;
}
.modal-open{
	position: relative;
	}
.modal-open::before{
	 content: '';
  width: 9px;
  height: 9px;
  border: 0;
  border-top: 2px solid #e2041b; /* 矢印の色 */
  border-right: 2px solid #e2041b; /* 矢印の色 */
  transform: rotate(45deg);
  position: absolute;
  top: 50%;
  left: 20px;
  margin-top: -6px;
}
.h4 {
	font-size: 100%;
	padding: 0.3rem 0em 0.3rem 0.5rem;
	border-left: 6px #27acd9 solid;
	text-align: left;
	margin: 0 0 10px 50px;
}

/*infoエリアをはじめは非表示*/
#info{
	display: none;
}
.info_box {
	padding: 5% 2%;
}
.modal-open {
	color: #fff;
	font-weight: 600;
	padding: 6px 20px;
	font-size: 25px;
}
a.modal-open {
	color: #e2041b;
	text-decoration: underline;
}

a.modal-open:hover {
	 opacity: 0.8;
}
/*モーダルの横幅を変更したい場合*/
.modaal-container{
    max-width: 800px;
}

/*モーダルのボタンの色を変更したい場合*/
.modaal-close:after, 
.modaal-close:before{
	background:#ccc;	
}

.modaal-close:focus:after,
.modaal-close:focus:before,
.modaal-close:hover:after,
.modaal-close:hover:before{
	background:#666;
}
h4{
  font-size:1.2rem;
  text-align: center;
  margin: 0 0 20px 0;
}
section{
  padding:5px;
}

section:nth-child(2n){
  background:#f3f3f3; 
}
.oshirase_box_center {
	text-align: center;
	margin: 5px;
	padding: 0;
}
.under_1 {
	background: linear-gradient(transparent 60%, #fff799 40%);
	font-size: 120%;
}
.under_2 {
	background: linear-gradient(transparent 60%, #fff799 40%);
}
.oshirase_box_p {
	text-align: left;
	padding: 0 5% 0 8%;
	font-size: 95%;
}
.oshirase_box_p_2 {
	text-align: left;
	padding: 0 3% 0 5%;
	font-size: 95%;
	margin: 10px 0 ;
	line-height: 120%;
}