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

#card-body *{ font-family: Lato, Roboto, "メイリオ", "游ゴシック", YuGothic, 'Noto Sans Japanese', "ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic ProN", sans-serif; -webkit-text-size-adjust: 100%; -ms-text-size-adjust: 100%; }
#card-body img{ display: inline; }
#card-body .pc,#card-body .sp{ display: none; }
#card-body .pc{ display: block; }
#card-body img.pc{ display: inline; }


@media screen and (max-width: 480px){ /*480px以下のcss*/
	#card-body .pc,#card-body img.pc{ display: none; }
	#card-body .sp{ display: block; }
	#card-body img.sp{ display: inline; }
}


#card-body{ max-width: 1200px; margin: 0 auto; }
#card-body .main-ttl{ padding: 60px 0; background-color: #0f9243; overflow: hidden; position: relative; }
#card-body .main-ttl .ttl{ position: relative; left: 50%; margin-left: -500px; }
#card-body .main-ttl .photo{ width: 438px; position: absolute; right: 50%; margin-right: -500px; text-align: center; top: 50%; transform: translateY(-50%); }
#card-body .main-ttl .bubble{ position: absolute; left: 50%; top: 30px; margin-left: 80px; }
#card-body .ttl-bottom-copy{ background-color: #ffffff; color: #cc0000; text-align: center; font-size: 42px; line-height: 1.5; font-weight: bold; padding: 20px 0; }
#card-body .ttl-bottom-copy.ext{ color: #ff5879; border: 5px solid #ff5879; margin: 30px 5% 0; }
#card-body .ttl-bottom-bnr{ margin: 0 auto; padding: 0 5%; text-align: center; }
#card-body .ttl-bottom-bnr img{ max-width: 100%; height: auto; }
#card-body .entry-view{ text-align: center; }
#card-body .entry-view .entry-note{ border: 1px solid #dd0000; width: 1000px; margin: 0 auto 40px; padding: 10px; font-size: 18px; line-height: 1.7; color: #dd0000; }
#card-body .entry-view .ttl{ font-size: 18px; color: #0758a7; font-weight: bold; }
#card-body .entry-view .card-list{ margin: 20px auto 0; width: 1000px; display: -ms-flex; display: flex; justify-content: space-between; }
#card-body .entry-view .card-list .card{ width: 320px; }
#card-body .entry-view .card-list .card+.card{ margin-left: 20px; }
#card-body .entry-view .card-list .card .name{ font-size: 20px; font-weight: bold; color: #333333; }
#card-body .entry-view .card-list .card .photo{ margin-top: 10px; }
#card-body .entry-view .card-list .card .credit-list{ margin-top: 5px; display: -ms-flex; display: flex; justify-content: center; }
#card-body .entry-view .card-list .card .credit-list .item+.item{ margin-left: 5px; }
#card-body .entry-view .card-list .card .credit-list .item img{ height: 40px; width: auto; }
#card-body .entry-view .card-list .card .type-list{ display: -ms-flex; display: flex; justify-content: center; flex-wrap: wrap; }
#card-body .entry-view .card-list .card .type-list .item{ font-size: 12px; line-height: 1.5; margin: 2px; padding: 2px 10px; }
#card-body .entry-view .card-list .card .type-list .item.family{ background-color: #b0d994; color: #fff; }
#card-body .entry-view .card-list .card .type-list .item.pitapa{ background-color: #e4e3f1; color: #919099; }
#card-body .entry-view .card-list .card .type-list .item.kids{ background-color: #f6ee7f; }
#card-body .entry-view .card-list .card .caption{ font-size: 12px; line-height: 1.5; margin-top: 5px; }
#card-body .entry-view .card-list .card .caption .marker{ font-weight: bold; text-decoration: underline; }
#card-body .entry-view .card-list .card .navi{ margin-top: 10px; }
#card-body .entry-view .card-list .card .navi a{ display: block; background-color: #da340a; color: #ffffff; padding: 14px 0; text-decoration: none; font-weight: bold; position: relative; }
#card-body .entry-view .card-list .card .navi a::before{ content: ''; position: absolute; width: 6px; height: 6px; border: solid #ffffff; border-width: 1px 1px 0 0; right: 10px; top: 50%; transform: translateY(-50%) rotate(45deg); opacity: 0.5; }
#card-body .entry-view .card-list .card .bnr-list{ margin-top: 20px; }
#card-body .entry-view .card-list .card .bnr-list .bnr+.bnr{ margin-top: 20px; }
#card-body .entry-view .card-list .card .bnr-list .bnr a{ display: block; }
#card-body .entry-view .card-list .card .bnr-list .bnr a img{ max-width: 100%; height: auto; }
#card-body .section02{ padding: 50px 0; background-color: #fefccf; }
#card-body .section02 .section-ttl{ text-align: center; }
#card-body .section02 .intro{ text-align: center; margin-top: 20px; }
#card-body .section02 .intro .txt{ text-align: center; }
#card-body .section02 .intro .caption{ max-width: 820px; margin: 10px auto 0; color: #333333; font-size: 12px; }
#card-body .section02 .intro .point{ margin-top: 20px; text-align: center; }
#card-body .section02 .split-view{ width: 1000px; position: relative; margin: 20px auto 0; }
#card-body .section02 .split-view .txt-body{  }
#card-body .section02 .split-view .txt-body .ttl{ font-size: 22px; color: #db2526; font-weight: bold; }
#card-body .section02 .split-view .txt-body .ttl .marker{ font-size: 28px; }
#card-body .section02 .split-view .txt-body .txt{ font-size: 20px; line-height: 1.2; color: #0f9243; font-weight: bold; margin-top: 10px; }
#card-body .section02 .split-view .txt-body .txt .marker{ font-size: 26px; }
#card-body .section02 .split-view .txt-body .txt .marker .num{ color: #db2526; }
#card-body .section02 .split-view .txt-body .caption{ margin-top: 10px; font-size: 12px; }
#card-body .section02 .split-view .graph{ position: absolute; right: 0; bottom: 0; width: 440px; text-align: center; }
#card-body .section02 .note{ text-align: center; margin-top: 30px; }
#card-body .section05{ padding: 50px 0; }


@media screen and (max-width: 480px){ /*480px以下のcss*/
	#card-body .main-ttl{ padding: 10% 5% 5%; }
	#card-body .main-ttl .ttl{ left: 0; margin-left: 0; }
	#card-body .main-ttl .photo{ width: auto; position: static; margin-right: 0; transform: none; width: 80%; margin-left: auto; margin-top: 20px; }
	#card-body .main-ttl .bubble{ position: absolute; left: auto; top: auto; margin: 10px 0 0; width: 24%; }
	#card-body .main-ttl .bubble img{ width: 100%; height: auto; }
	#card-body .ttl-bottom-copy{ font-size: 24px; padding: 10px 0; }
	#card-body .ttl-bottom-copy.ext{ border-width: 2px; margin: 7% 5% 0; }
	#card-body .entry-view .entry-note{ width: auto; margin-bottom: 5%; font-size: 14px; }
	#card-body .entry-view .card-list{ margin-top: 5%; width: 100%; display: block; }
	#card-body .entry-view .card-list .card{ width: auto; }
	#card-body .entry-view .card-list .card+.card{ margin: 8% 0 0; padding-top: 8%; border-top: 1px solid #cccccc; }
	#card-body .entry-view .card-list .card .info-box{ height: auto!important; }
	#card-body .entry-view .card-list .card .photo{ margin-top: 10px; }
	#card-body .entry-view .card-list .card .credit-list .item+.item{ margin-left: 5px; }
	#card-body .entry-view .card-list .card .credit-list .item img{ height: 40px; width: auto; }
	#card-body .section02{ padding: 10% 5%; }
	#card-body .section02 .intro{ margin-top: 5%; }
	#card-body .section02 .intro .point{ margin-top: 0; }
	#card-body .section02 .split-view{ width: auto; margin-top: 0; }
	#card-body .section02 .split-view .txt-body .ttl{ font-size: 16px; }
	#card-body .section02 .split-view .txt-body .ttl .marker{ font-size: 20px; }
	#card-body .section02 .split-view .txt-body .txt{ font-size: 14px; }
	#card-body .section02 .split-view .txt-body .txt .marker{ font-size: 18px; }
	#card-body .section02 .split-view .graph{ position: static; width: auto; margin-top: 5%; }
	#card-body .section02 .note{ margin-top: 5%; }
	#card-body .section05{ padding: 10% 5%; }
	#card-body .section05 .bnr{ margin-top: 5%; }
}