/* リセットと基本設定 */
* {
  box-sizing: border-box;
  margin: 0;
  padding: 0;
}

body {
  font-family: "Hiragino Kaku Gothic ProN", "Meiryo", sans-serif;
  color: #333;
  line-height: 1.6;
  background-color: #f5f5f5; /* PC閲覧時の背景色 */
}

/* ラッパー：モバイルベース、PC用max-width制限 */
.lp-wrapper {
  width: 100%;
  background-color: #ffffff;
  position: relative;
  overflow: hidden;
  padding-bottom: 100px; /* 追従ボタン用の余白 */
}

/* PC向けレスポンシブ (.md クラスの適用) */
@media screen and (min-width: 751px) {
  .lp-wrapper{
    max-width: 750px;
    margin: 0 auto;
    box-shadow: 0 0 20px rgba(0,0,0,0.1);
  }
}

/* 共通ユーティリティ */
.text-red { color: #e60033; font-weight: bold; }
.text-blue { color: #005bac; }
img { max-width: 100%; height: auto; }
.small{font-size: 0.8em;
    line-height: 1.5;
display: inline-block;}

/* ヘッダー */
.lp-header {
  background-color: #003366;
  color: #ffffff;
  text-align: center;
  padding: 10px;
  font-size: 14px;
  font-weight: bold;
}

/* ヒーローセクション */
.hero {
  text-align: center;
  padding: 20px 15px;
  background: url("../img/img-kv.jpg") no-repeat top center/contain; /* 背景の柄画像があれば設定 */
}
.hero-badge {
  background-color: #ff5577;
  color: #fff;
  display: inline-block;
  padding: 5px 20px;
  border-radius: 20px;
  font-weight: bold;
  margin-bottom: 10px;
}
@media screen and (min-width:751px){
.hero-badge {
	font-size:28px;
}
}
.hero-title {
  color: #003366;
  font-size: 24px;
font-weight: bold;
  line-height: 1.4;
  margin: 5px 0 20px;
}
@media screen and (min-width:751px){
.hero-title {
	font-size: 36px;
	margin: 50px;
}
}
.hero-offer {
  border: 2px solid #ffcc00;
  border-radius: 10px;
  padding: 15px;
  background:#fff url("../img/hero-offer-badge.png")no-repeat left top/30%;
  margin-bottom: 15px;
}
@media screen and (min-width:751px){
	.hero-offer {
  background:#fff url("../img/hero-offer-badge.png")no-repeat left top/20%;
}
}
.offer-date {
  background-color: #ff3355;
  color: #fff;
  border-radius: 20px;
  padding: 5px 15px;
  font-size: 14px;
  font-weight: bold;
  margin-bottom: 10px;
  display: inline-block;
}

.offer-main {
  color: #005bac;
  font-size: 36px;
	font-weight: bold;
}

.offer-main span {
  color: #e60033;
  font-size: 48px;
}

.hero-note {
  font-size: 11px;
  color: #666;
  text-align: left;
  margin-bottom: 20px;
}

.hero-sub-offer {
  border: 1px solid #005bac;
  border-radius: 10px;
  padding: 15px;
  margin-bottom: 20px;
  position: relative;
	font-weight: bold;
}

.sub-offer-badge {
  background: #005bac;
  color: #fff;
  border-radius: 20px;
  padding: 2px 15px;
  font-size: 12px;
  position: absolute;
  top: -12px;
  left: 50%;
  transform: translateX(-50%);
}

.sub-offer-text {
  color: #005bac;
  font-size: 16px;
  margin-top: 10px;
}

.sub-offer-text strong {
  font-size: 20px;
}
.sub-offer-text strong .very{
  font-size: 28px;
}

/* ボタン共通 */
.btn-primary {
  display: block;
  background: linear-gradient(to right, #ff3355, #e60033);
  color: #ffffff;
  text-decoration: none;
  font-weight: bold;
  font-size: 18px;
  padding: 15px 0;
  border-radius: 30px;
  box-shadow: 0 4px 6px rgba(0,0,0,0.1);
  margin: 0 auto 10px;
  width: 90%;
  text-align: center;
}

.btn-note {
  font-size: 10px;
  color: #666;
  text-align: left;
  padding: 0 5%;
}

/* こんな方へ */
.target-audience {
  background-color: #fffaf0;
  padding: 20px;
  margin: 20px 15px;
  border-radius: 10px;
}

.target-audience h3 {
  text-align: center;
  margin-bottom: 15px;
	 color: #003366;
	font-weight:bold;
	font-size:18px;
}

.target-audience ul {
  list-style-type: none;
}

.target-audience li {
  position: relative;
  padding-left: 25px;
  margin-bottom: 10px;
  font-weight: bold;
  color: #003366;
}

.target-audience li::before {
  content: '✔';
  color: #e60033;
  position: absolute;
  left: 0;
  top: 0;
}

/* キャンペーンセクション */
.campaign1 {
  border: 2px solid #ffcccc;
  border-radius: 10px;
  margin: 20px 15px;
  padding: 20px 15px;
  position: relative;
}
@media screen and (min-width:751px){
	.campaign1 {
  padding: 20px 30px;
}
}
.camp-header {
  display: flex;
  align-items: center;
  margin-bottom: 15px;
	gap:10px;
	font-weight:bold;
}

.camp-num {
width:16%;
}

.campaign1 h2 {
  color: #e60033;
  font-size: 28px;
}
.camp-target {
  border: 1px solid #ff3355;
  color: #ff3355;
  border-radius: 15px;
  padding: 2px 10px;
  font-size: 12px;
  margin-left: 10px;
}

.camp-desc {
  font-weight: bold;
  margin-bottom: 20px;
}

/* コース内容ボックス */
.campaign1 .course-box {
  border-radius: 10px;
  padding: 15px;
  margin-bottom: 15px;
}
.campaign1 .course-sho3 {
  background: #fdf4f5;
  border: 1px solid #ffcccc;
}
.campaign1 .course-sho4 {
  background: #f0f8ff;
  border: 1px solid #cce5ff;
}
.course-box h4 {
  text-align: center;
  margin-bottom: 10px;
	
	font-weight:bold;
}
.campaign1 .course-sho3 h4{
	color:#f33f58;
}
.campaign1 .course-sho4 h4{
	color: #005bac;
}
.course-box ul {
  list-style-type: none;
  font-size: 14px;
	display:flex;
	flex-wrap:wrap;
	gap:10px;
}

.course-box li {
  margin-bottom: 10px;
	display:flex;
	align-items: center;
    gap: 10px;
}
@media screen and (min-width:751px){
	.course-box li {
	width:49%;
}
}
.course-box li img{
  display:inline-block;
	width:35px;
}
.plus-mark {
  text-align: center;
  color: #f33f58;
  font-size: 24px;
  font-weight: bold;
  margin: 0 0 10px 0;
}

.self-study {
  background: #fff;
  padding: 10px;
  border-radius: 8px;
}
.self-study .small{
  font-size:0.9em;
line-height:1.5;
margin-right:10px;	
}
.self-study_img{
	    display: flex;
    justify-content: space-around;
    align-items: center;
}
/*@media screen and (min-width:751px){
.md-flex{
display:flex;
	}
}*/

.campaign2 {
  border: 2px solid #a5daab;
  border-radius: 10px;
  margin: 20px 15px;
  padding: 20px 15px;
  position: relative;
}
.campaign2 h2 {
  color: #1ea32c;
  font-size: 22px;
}
.campaign2 .course-box {
  background: #f3f7f0;
  border: 1px solid #dde7df;
  border-radius: 10px;
  padding: 15px;
  margin-bottom: 15px;
}
.campaign2 .course-box .ttl{
  background-color: #1ea32c;
  color:#ffffff;
border-radius: 20px;
  padding: 2px 15px;
  font-size: 12px;
	font-weight:bold;
	margin-bottom:5px;
}
.campaign2 .course-box li {
	align-items: flex-start;
}
.btn-taiken {
  display: block;
  background: linear-gradient(to right, #6fb855, #449a3b);
  color: #ffffff;
  text-decoration: none;
  font-weight: bold;
  font-size: 18px;
  padding: 15px 0;
  border-radius: 30px;
  box-shadow: 0 4px 6px rgba(0,0,0,0.1);
  margin: 0 auto 10px;
  width: 90%;
  text-align: center;
}

/* よくあるご質問 */
.faq-section {
  padding: 30px 15px;
}

.section-title {
  text-align: center;
  color: #005bac;
  margin-bottom: 20px;
  font-size: 20px;
font-weight:bold;
}
@media screen and (min-width:751px){
	.section-title {
  font-size: 28px;
}
	.txt-about{
	font-size:20px;
}
}
.txt-about{
	font-weight:bold;
	text-align:center;
	font-size:16px;
	margin-bottom:30px;
	line-height:1.8;
}
.faq-item {
  border-bottom: 1px dashed #ccc;
  padding: 15px 0;
}

.faq-item.border-none {
  border-bottom: none;
}

.faq-q {
  font-weight: bold;
  color: #003366;
  margin-bottom: 10px;
  display: flex;
}

.faq-q span {
  background: #005bac;
  color: #fff;
  border-radius: 50%;
  width: 24px;
  height: 24px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  margin-right: 10px;
  flex-shrink: 0;
}

.faq-a {
  padding-left: 34px;
  font-size: 14px;
}

/* スケジュール */
.schedule-section {
  padding: 20px 15px;
}

.schedule-card {
  border-radius: 10px;
  padding: 20px 15px;
  margin-bottom: 20px;
}
.schedule-sho3 {
  background: #fff5f5;
}
.schedule-sho4 {
  background: #f3f7f0;
}

.schedule-card h3 {
  text-align: center;
  margin-bottom: 15px;
	font-size:20px;
}
.schedule-sho3 h3 {
  color: #e60033;
}
.schedule-sho4 h3 {
  color: #005bac;
}

.schedule-table {
  width: 100%;
  border-collapse: collapse;
  font-size: 12px;
  margin-top: 10px;
}

.schedule-table th, .schedule-table td {
  padding: 8px 5px;
  text-align: center;
}

.schedule-table th {
  font-weight: normal;
  border-bottom: 1px solid #ccc;
}

.schedule-sho4 tr {
  border-bottom: 1px solid #ccc;
}

.table-note {
  font-size: 10px;
  color: #666;
  margin-top: 10px;
}

/* 追従CTA */
.floating-cta {
  position: fixed;
  bottom: 0;
  left: 0;
  width: 100%;
  background: rgba(255, 255, 255, 0.95);
  padding: 10px 15px;
  box-shadow: 0 -2px 10px rgba(0,0,0,0.1);
  display: flex;
  align-items: center;
  justify-content: space-between;
  z-index: 100;
}

@media screen and (min-width: 751px) {
  .floating-cta {
    /* PC表示時の追従エリアも750px幅に合わせる */
    max-width: 750px;
    left: 50%;
    transform: translateX(-50%);
  }
}

.f-cta-badge {
  background: #ffcc00;
  color: #333;
  font-size: 10px;
  font-weight: bold;
  padding: 2px 5px;
  border-radius: 3px;
  position: absolute;
  top: -10px;
  left: 15px;
}

.f-cta-text {
  font-size: 12px;
  line-height: 1.2;
}

.f-cta-main {
  display: block;
  font-size: 16px;
  font-weight: bold;
}

.floating-cta .btn-primary {
  width: auto;
  margin: 0;
  padding: 10px 20px;
  font-size: 14px;
}