@charset "utf-8";
/* CSS Document */

#kokohori .TVerArea{
	max-width:600px;
	padding:20px 10px;
	margin:0 auto 50px auto;
	background: #ffffff;
	border-radius: 16px;
	text-align: center;
}
#kokohori .aboutProgram .topTxt .TVerArea p, #kokohori .presentArea p {
    font-size: 1.6em;
	color: #454545;
	font-weight: bold;
	line-height: 1.7em;
}

#kokohori .aboutProgram .topTxt .TVerArea img {
	width: 240px;
	border: solid 3px #dfdfdf;
}
#kokohori .aboutProgram .topTxt .TVerArea img:hover {
	animation: poyo .6s;
}
@keyframes poyo {
	from, to { transform: none; }
	10% { transform: scale(1.2); }
	40% { transform: scale(.9); }
	60% { transform: scale(1.04); }
	80% { transform: scale(.98); }
}

#kokohori .btn-flat a img{
	transform: scale(0.5, 1.5);
	transition: .4s;
}
#kokohori .btn-flat a img:hover {
	transform: scale(0.5, 1.5);
	transition: .4s;
}
@media screen and (max-width: 767px) {
	#kokohori .TVerArea{
		margin-top:20px;
	}
}

/* プレゼント
------------------------------------ */
#kokohori .preTitleArea{
	display: flex;
	flex-direction: row;
	justify-content: center;
	width: 100%;
}
#kokohori .preTitle{
	font-size: 3.5em;
    margin: auto 0.5em;
	color: #454545;
    font-weight: bold;
}
#kokohori .preTitleImg{
	width: 18%;
}
@media screen and (max-width: 767px) {
	#kokohori .preTitle{
		font-size: 2.5em;
	}
	#kokohori .preTitleImg{
		width: 40%;
	}
}

#kokohori .presentArea{
	max-width:1000px;
	padding:20px;
	margin:50px auto 50px auto;
	background: #ffffff;
	border-radius: 16px;
	text-align: center;
}
#kokohori .presentArea2,
.presentArea2{
  display: flex;
	flex-direction: row;
	justify-content: center;
	width: 100%;
	margin-top: 1em;
	}
#kokohori .preBox2,
.preBox2{
	width:50%;
	/*margin-right:1em;*/
	padding:0.75em;
	/*border-radius:10px;
	border: solid 4px #e9e9e9;
	margin: 0 10px;*/
}
#kokohori .preImg2,
.preImg2{
	max-width:98%;
	border-radius:10px;
	border: solid 4px #e9e9e9;
	/*margin: 0 10px;*/
}
#kokohori .preBox2 h5,
.preBox2 h5{
	font-size:2em;
	line-height: 1.4em;
	text-align: center;
	margin: 0 auto 10px;
	color: #454545;
	font-weight: bold;
}

@media screen and (max-width: 768px) {
	#kokohori .preBox2,
	.preBox2{
		width:100%;
		margin:1em auto;
		text-align: center;
	}
	#kokohori .preBox2 h5,
	.preBox2 h5{
		text-align:center;
		font-size: 1.6em;
	}
	#kokohori .presentArea2,
	.presentArea2{
		justify-content: center;
		flex-direction: column;
	}
}

#kokohori a.preBtn {
    background: #ff4700;
    border-radius: 9999px;
    position: relative;
    display: flex;
    justify-content: space-around;
    align-items: center;
    margin: 0 auto;
    max-width: 300px;
    padding: 10px 25px;
    color: #ffffff;
    line-height: 1.8;
    text-decoration: none;
    transition: 0.3s ease-in-out;
    font-weight: 500;
	font-size: 1.6em;
	border:#ff4700 solid 2px;
}
#kokohori a.preBtn:hover {
    background: #ffffff;
    color: #ff4700;
}

#kokohori .marker{
  display:inline;
  padding:0 6px 0;
  margin:0 2px;
  background:linear-gradient(transparent 0%, #ff4700 0%);
  color: #ffffff;
  /*font-size: 0.96em;*/
}

.fontRed{
	color: #ff4700!important;
	font-weight: bold!important;
}

.fontSS{font-size:0.5em!important;}
.fontS{font-size:0.8em!important;}
.fontM{font-size:1.2em!important;}
.fontMM{font-size:1.3em!important; line-height:1.6em!important;}
.fontL{font-size:1.5em!important;line-height:1.8!important;}
.fontLL{font-size:2em}

.mt0{margin-top:0 !important}
.mt5{margin-top:5px !important}
.mt10{margin-top:10px !important}
.mt1em{margin-top:1em !important}
.mt2em{margin-top:2em !important}
.mt3em{margin-top:3em !important}

.mb0{margin-bottom:0 !important}
.mb5{margin-bottom:5px !important}
.mb10{margin-bottom:10px !important}
.mb1em{margin-bottom:1em !important}
.mb2em{margin-bottom:2em !important}

.mr0{margin-right:0 !important}
.mr5{margin-right:5px !important}
.mr10{margin-right:10px !important}
.mr1em{margin-right:1em !important}
.mr2em{margin-right:2em !important}

.ml0{margin-left:0 !important}
.ml5{margin-left:5px !important}
.ml10{margin-left:10px !important}
.ml1em{margin-left:1em !important}
.ml2em{margin-left:2em !important}

/* テキスト - SPのみ
------------------------*/
@media screen and (max-width:767px){
  .brSP:before{content:"\A";display:block}
  .hiddenSP,.forPC,.forTB{display:none}
}
/* テキスト - TBのみ
------------------------*/
@media screen and (min-width:768px) and (max-device-width:991px){
  .brTB:before{content:"\A";display:block}
  .hiddenTB,.forPC,.forSP{display:none}
}
/* テキスト - PC
------------------------*/
@media screen and (min-width:992px){
  .brPC:before{content:"\A";display:block}
  .hiddenPC,.forTB,.forSP{display:none}
  }

#kokohori .program .contents .topBox dl>div .pointTxt{
	font-size: 2em;
	font-weight: 700;
	line-height: 1.4;
	text-align: center;
}
@media screen and (max-width: 768px) {
	#kokohori .program .contents .topBox dl>div .pointTxt{
		font-size: 1.6em;
	}
}

.PastBroadcasts{
	position: relative;
	background: #ea3d3c!important;
	padding: 0.3em !important;
	color: white!important;
	border-radius: 0.5em!important;
	font-size: 3.2em !important;
	text-align: center!important;
	font-weight: bold!important;
	margin: 3em auto 1.5em !important;
}
@media screen and (max-width: 768px) {
	.PastBroadcasts{
		width: 90%;
		margin: 3em auto 1em !important;
		font-size: 2.5em !important;
	}
}