/* ベーススタイル */
html {
    box-sizing: border-box; /* paddingとborderをwidth/heightに含める */
}

*, *::before, *::after {
    box-sizing: inherit; /* 全要素にbox-sizingを継承させる */
}

body {
    margin: 0;
    padding: 0;
}

/* 全体を包括するラッパー */
#cam50thWrap {
    width: 100%;
    overflow: hidden;
    line-height: 1.6;
    color: #333;
    background-color: #00AFEC; /* 全体の背景色を00AFECに変更 */
    -webkit-font-smoothing: antialiased; /* フォントを滑らかにする */
}

/* セクションの共通スタイル */
.cam-section {
    padding: 50px 0; /* 上下の余白 */
    margin-bottom: 50px;
    background-color: #00AFEC; /* デフォルトのセクション背景色を全体背景色に合わせる */
}

/* 全体背景が白のセクション */
.cam-section--white-bg {
    background-color: #fff;
}

/* セクション内のコンテンツ幅の制御 */
.cam-head_content-wrap,
.cam-nav_buttons-wrap,
.cam-title,
.top_txt,
.cam-content-box,
.entry_flow-section,
.cam-notes,
#precaution .precaution_title {
    max-width: 1000px;
    margin-left: auto;
    margin-right: auto;
    padding: 0 20px; /* 左右の余白（レスポンシブ対応） */
}


/* 説明テキストエリア */
.top_txt {
    text-align: center;
    font-size: 1.2em;
    margin-bottom: 50px;
    color: #fff;
    font-weight: bold;
}

/* 共通のタイトル画像ラッパー */
.cam-title {
    text-align: center;
    margin-bottom: 30px;
	max-width: 1200px;
	padding: 0;
}
.cam-title img {
	max-width: 1200px;
	padding: 0;
    width: 100%;
    height: auto;
}

/* 共通の角丸白背景コンテンツボックス */
.cam-content-box {
    background-color: #fff;
    border-radius: 20px;
    padding: 40px 10px;
    text-align: center;
    margin-top: 30px;
    margin-bottom: 70px; /* 下に70pxのマージン */
}
.cam-content-box img {
    max-width: 960px;
    width: 100%;
    height: auto;
}

/* 共通の注意事項リスト */
.cam-notes {
	/**
    background-color: #fff;
    padding: 30px;
    border-radius: 10px;
    box-shadow: 0 2px 5px rgba(0,0,0,0.1);
	**/
	color: #fff;
	padding-top: 30px;
	width: 94%;
	max-width: 960px;
}
.cam-notes h3 {
    font-size: 1.5em;
    margin-bottom: 20px;
}
.cam-notes ul {
    list-style: disc;
    padding-left: 20px;
}
.cam-notes li {
    margin-bottom: 5px;
    line-height: 1.8;
	text-align: left;
}

/* --- 見出しと概要 (#cam50thHead) --- */
#cam50thHead {
    padding: 0; /* ヘッダー部分は上下の余白を調整 */
    margin-bottom: 50px;
}

#cam50thHead .cam-head_main-img {
    width: 100%;
    text-align: center;
    position: relative;
    background-image: url('../50th/img/main_50th_bg.png');
    background-size: cover;
    background-position: top;
    padding: 30px 0 20px;
}

#cam50thHead .cam-head_main-img img {
    width: 100%;
    max-width: 900px;
    height: auto;
    display: block;
    margin: 0 auto; /* センタリング */
}

#cam50thHead .cam-head_content-wrap {
    text-align: center;
    padding: 0 20px; /* 左右の余白を維持 */
}

#cam50thHead .cam-head_period-txt {
    display: inline-block;
    background-color: #fff;
    color: #000;
    padding: 10px 20px;
    border-radius: 20px;
    font-weight: bold;
    margin-bottom: 20px;
    font-size: 1.4em;
}

#cam50thHead .cam-head_period-txt span {
    color: #F15A24;
    font-size: 1.2em;
	padding-left: 25px;
}

#cam50thHead .cam-head_period-txt span:last-of-type{
	padding: 0;
}


#cam50thHead .cam-head_summary-txt {
    display: inline-block;
    max-width: 960px;
    color: #fff;
    font-weight: bold;
	font-size: 1.4em;
	padding-top: 15px;
}

/* --- ページ内ナビゲーション (#cam50thNav) --- */
#cam50thNav {
    padding-top: 0;
    text-align: center;
}

#cam50thNav .cam-nav_buttons-wrap {
    display: flex;
    flex-wrap: wrap; /* ボタンが複数行になる可能性を考慮 */
    justify-content: center;
    gap: 20px; /* ボタン間の隙間 */
    margin: 0 auto;
    padding: 0 20px; /* 左右の余白を維持 */
}

#cam50thNav .cam-nav_btn {
    flex: 1 1 300px; /* 成長・収縮可能、基本幅300px */
    min-height: 80px;
    background: linear-gradient(to bottom, #FFF000, #F29600); /* 黄色グラデーション */
    color: #000;
    text-decoration: none;
    border-radius: 10px;
    font-weight: bold;
    font-size: 1.4em;
    line-height: 1.4;
    transition: transform 0.2s ease-in-out; /* マウスオーバーアニメーション */
    text-align: center;
    padding: 10px 0; /* ボタン内のテキストの余白 */
    min-width: 250px; /* ボタンの最小幅 */
}

#cam50thNav .cam-nav_btn:hover {
    transform: translateY(5px); /* 下にずれるモーション */
}

#cam50thNav .cam-nav_btn--full-width {
    flex-basis: 100%; /* 下段のボタンが横幅いっぱいになるように */
    max-width: 620px; /* 上段のボタンの合計幅に合わせる */
}

#cam50thNav .cam-nav_btn span{
	display: block;
	width: 100%;
	font-size: 1.3em;
	line-height: 1.3;
	color: #fff;
	  text-shadow:1px 1px 0 #000, -1px -1px 0 #000,
              -1px 1px 0 #000, 1px -1px 0 #000,
              0px 1px 0 #000,  0-1px 0 #000F,
              -1px 0 0 #000F, 1px 0 0 #000;
	
}


/* --- アンケートプレゼント (#entry) --- */
#entry {
    /* ここから下は元のCSSに戻しました */
    padding: 50px 0; /* 上下の余白 */
    margin-bottom: 50px;
    background-color: #00AFEC; /* デフォルトのセクション背景色を全体背景色に合わせる */
}

#entry .top_txt {
    text-align: center;
    font-size: 1.2em;
    margin-bottom: 50px;
}

#entry .top_txt span{
	color: #FFF000;
}

#entry .cam-content-box {
    background-color: #fff;
    border-radius: 20px;
    padding: 30px;
    text-align: center;
    margin-top: 30px;
    margin-bottom: 70px; /* 下に70pxのマージン */
    border: none; /* 元のborderはなし */
}


#entry .entry_flow-section {
    margin-top: 50px;
    margin-bottom: 50px;
	padding: 70px 0;
	background: #fff;
	width: 100%;
	max-width: 100%;
    /* 元のCSSには背景色の指定がなかったため、ここでは削除 */
    /* padding-topとpadding-bottomも元の状態に戻しました */
}
#entry .entry_flow-title {
    text-align: center;
    font-size: 1.8em;
    font-weight: bold;
    margin-bottom: 10px;
	color: #00A0E9;
}

/* エントリーフロー図のCSS */
.entry_flow { /* .flow_design10 から変更 */
    display: flex;
    justify-content: center;
    align-items: flex-start; /* 上揃えにする */
    margin-bottom: 0; /* paddingで余白を取るため0にする */
}

.entry_flow_list { /* .flow10 から変更 */
    padding-left: 0;
    list-style-type: none;
    width: 100%; /* 親要素の幅いっぱいに広げる */
    max-width: 800px; /* フロー図自体の最大幅 */
}

.entry_flow_list > li {
    list-style-type: none;
    border: 2px solid #00A0E9; /* 縁色を#00A0E9に変更 */
    background-color: #fff; /* 背景色を#fffに変更 */
    padding: 20px;
    border-radius: 20px;
}

.entry_flow_list > li:not(:last-child) {
    margin-bottom: 40px;
    position: relative;
}

.entry_flow_list > li:not(:last-child)::after {
    content: '';
    position: absolute;
    border: 20px solid transparent;
    width: 0;
    height: 0;
    bottom: -53px; /* 矢印の位置調整 */
    left: 50%;
    transform: translateX(-50%);
    border-top-color: #EA5514; /* 矢印を#EA5514に変更 */
}

.entry_flow_item { /* .flow10_item から変更 */
    /* 特にスタイル変更なし */
}

.entry_flow_head { /* .flow10_dt から変更 */
    font-size: 1.4em;
    font-weight: bold;
    border-bottom: 2pt solid #00A0E9;
    padding-bottom: 0.5em;
    margin-bottom: 0.8em;
    line-height: 1.4;
	color:#EA5514;
}

.entry_flow_head .entry_flow_icon { /* .flow10_dt .icon10 から変更 */
    color: #00A0E9; /* 縁色に合わせる */
    margin-right: 0.5em;
    font-size: 1.1em; /* 数字を少し大きく */
    display: inline-block;
    /**vertical-align: middle; **/
}

.entry_flow_content { /* .flow10_dd から変更 */
    margin: 0;
    display: flex;
    align-items: center; /* 垂直方向中央揃え */
    gap: 20px; /* テキストと画像の間の隙間 */
}

.entry_flow_content .entry_flow_text { /* .flow10_dd .flow10_text から変更 */
    flex: 1; /* 利用可能なスペースを占有 */
    line-height: 1.6;
	text-align: left;
	font-weight: bold;
	font-size: 1.1em;
}

.entry_flow_content .entry_flow_image { /* .flow10_dd .flow10_image から変更 */
    flex-shrink: 0; /* 画像が縮まないようにする */
    width: 200px; /* 画像の固定幅 */
    text-align: right; /* 画像を右寄せ */
}

.entry_flow_content .entry_flow_image img {
    max-width: 100%;
    height: auto;
    display: block;
    margin-left: auto; /* 右寄せにするための調整 */
}



/* line登録 */
#entry #entry_line{
	margin: 30px auto 40px;
	border-radius: 20px;
	width: 100%;
	max-width: 800px;
	border:2px solid #00913A;
}

#entry #entry_line > div{
	padding: 20px;
}

#entry #entry_line .entry_flow_head {
    font-size: 1.4em;
    font-weight: bold;
    border-bottom: 2pt solid #00913A;
    padding-bottom: 0.5em;
    margin-bottom: 0.8em;
    line-height: 1.4;
	color:#000;
}
#entry #entry_line .entry_flow_head span{
	color: #00913A;
}

.triangle-angled-div {
    position: relative; /* 擬似要素の基準にする */
    background-color: #FFF000; /* 背景色をFFF000に変更 */
    padding: 10px 15px; /* 内側の余白 */
	margin-top: 15px;
    max-width: 800px; /* 最大幅の例 */
    z-index: 1; /* 他の要素との重なり順を調整 */
    padding-right: 50px; /* 三角形が重なる分、右側のパディングを増やす */
	text-align: center;
	font-weight: bold;
}

.triangle-angled-div::after {
    content: '';
    position: absolute;
    /* 吹き出しのしっぽの位置調整 */
    top: 50%;
    right: -15px; /* divの右端から外に出す */
    transform: translateY(-50%); /* 縦方向中央揃え */
    width: 0;
    height: 0;
    /* 右側に尖る三角形 */
    border-top: 10px solid transparent; /* 上辺の高さと透明 */
    border-bottom: 10px solid transparent; /* 下辺の高さと透明 */
    border-left: 15px solid #FFF000; /* 三角形の底辺（親要素の背景色と同じ） */
    z-index: 2; /* 親要素のコンテンツより手前に表示 */
}

/* レスポンシブ対応 (例: 768px以下の場合) */
@media (max-width: 768px) {
    .triangle-angled-div {
        padding: 20px;
        margin: 30px 10px 10px; /* 左右に余白を持たせる */
        padding-right: 20px; /* SPでは通常のパディングに戻す */
    }

    .triangle-angled-div::after {
        /* SP時は下側が尖るように調整 */
        top: auto; /* topの指定を解除 */
        bottom: -20px; /* divの下端から外に出す */
        right: 50%; /* 横方向中央揃え */
        transform: translateX(50%); /* 横方向中央揃えの微調整 */
        
        border-top: 20px solid #FFF000; /* 下に尖る三角形の頂点（親要素の背景色と同じ） */
        border-left: 20px solid transparent;
        border-right: 20px solid transparent;
        border-bottom: none; /* 下向きなので不要 */
    }
}




/* 当選のご案内 & 賞品のお渡しについて */
#entry .entry-bottom-info-wrap {
    display: flex;
    flex-wrap: wrap; /* 折り返し */
    justify-content: center;
    gap: 30px; /* ボックス間の間隔 */
    max-width: 1000px;
    margin: 50px auto 0 auto;
    padding: 0 20px;
}

#entry .entry-info-box {
    background-color: #fff;
    border-radius: 20px;
    padding: 10px 20px;
    flex: 1 1 calc(50% - 15px); /* 2列レイアウト、ギャップを考慮 */
    min-width: 300px; /* 最小幅 */
    border: 3px solid #00AFEC; /* 水色の枠線 */
}

#entry .entry-info-box .info-box-title {
    color: #00AFEC;
    font-size: 1.8em;
    font-weight: bold;
    text-align: center;
    padding: 10px 20px;
    white-space: nowrap; /* テキストの改行を防ぐ */
}

/* 当選のご案内 */
#entry .winner-info .info-content-flex {
    display: flex;
    align-items: center;
    gap: 20px;
}

#entry .winner-info .info-text {
    flex-grow: 1;
    text-align: left;
}

#entry .winner-info .winner-date {
    font-size: 1.2em;
    font-weight: bold;
    color: #036EB8;
    margin-bottom: 10px;
    line-height: 1.2;
}

#entry .winner-info .winner-date span{
	font-size: 1.3em;
	color: #000;
}

#entry .winner-info .winner-detail {
    line-height: 1.5;
}

#entry .winner-info .info-image {
    flex-shrink: 0;
    width: 120px;
}

#entry .winner-info .info-image img {
    max-width: 100%;
    height: auto;
    display: block;
}

/* 賞品のお渡しについて */
#entry .prize-delivery-info {
    text-align: left;
}

#entry .prize-delivery-info .delivery-points {
    margin-bottom: 20px;
}

#entry .prize-delivery-info .delivery-item {
    align-items: center;
	padding-bottom: 15px;
}

#entry .prize-delivery-info .delivery-label {
    background-color: #FFD700; /* 黄色の背景 */
    color: #000;
    font-weight: bold;
    padding: 5px 12px;
    border-radius: 1px;
    flex-shrink: 0;
    line-height: 1.3;
	display: block;
	text-align: center;
	margin-bottom: 5px;
}

#entry .prize-delivery-info .delivery-location {
    font-size: 1em;
    color: #333;
    flex-grow: 1;
    line-height: 1.4;
}

#entry .prize-delivery-info .delivery-note {
    font-size: 0.85em;
    color: #777;
    text-align: center;
    line-height: 1.4;
    margin-top: 30px;
}

#entry .prize-delivery-info .delivery-location strong span{
	color: #fff;
	background: #00A0E9;
	padding: 2px;
	margin-right: 10px;
}



/* --- 注意事項 (#precaution) --- */
#precaution {
    padding-top: 50px;
    padding-bottom: 50px;
    margin-bottom: 0; /* 最後のセクションなので下マージンは不要 */
}

#precaution .precaution_title {
    text-align: center;
    color: #000;
    font-size: 1.4em;
}

#precaution ul li{
	color: #000;

}

/* --- レスポンシブ対応 --- */
@media (max-width: 768px) {
    /* セクションの共通余白 */
    .cam-section {
        padding: 30px 0;
        margin-bottom: 30px;
    }

    /* 説明テキストエリア */
    .top_txt {
        font-size: 1em;
        margin-bottom: 30px;
        text-align: left; /* SPでは左寄せにするなど調整 */
    }

    /* 共通のタイトル画像ラッパー */
    .cam-title {
        margin-bottom: 20px;
    }

    /* 共通の角丸白背景コンテンツボックス */
    .cam-content-box {
        padding: 20px;
        margin-bottom: 50px;
    }

    /* 共通の注意事項リスト */
    .cam-notes {
        padding: 20px;
        margin: 30px auto;
    }
    .cam-notes h3 {
        font-size: 1.3em;
    }

    /* 見出しと概要 */
    #cam50thHead .cam-head_main-img {
        padding: 10px 0;
		background-size: contain;
    	background-repeat: no-repeat;
		background-position: top;
    }
	
	#cam50thHead .cam-head_main-img img {
		width: 94%;
	}


    #cam50thHead .cam-head_period-txt {
        padding: 8px 15px;
		font-size: 1.1em;
		width: 90%;
    }
	
	#cam50thHead .cam-head_period-txt span{
		display: block;
		padding: 0;
    }

    #cam50thHead .cam-head_summary-txt {
        font-size: 1.2em;
        padding: 15px;
    }

    /* ページ内ナビゲーション */
    #cam50thNav .cam-nav_buttons-wrap {
        flex-direction: column; /* ボタンを縦に並べる */
        gap: 15px;
    }

    #cam50thNav .cam-nav_btn {
        min-height: 60px;
        font-size: 1.2em;
        flex-basis: auto; /* SPでは固定値ではなく自動調整 */
        max-width: none; /* 最大幅を解除 */
		padding: 15px 0;
    }

    #cam50thNav .cam-nav_btn--full-width {
        flex-basis: auto; /* SPでは固定値ではなく自動調整 */
        max-width: none; /* 最大幅を解除 */
    }
	
	#cam50thNav .cam-nav_btn span{
		font-size: 1.4em;
	}

    /* エントリーフロー図 */
    .entry_flow-section {
        margin-top: 30px;
        margin-bottom: 30px;
    }

    .entry_flow-title {
        font-size: 1.4em!important;
        margin-bottom: 30px;
    }

    .entry_flow {
        margin-bottom: 30px;
    }
	
	.entry_flow_list{
		width: 94%;
		margin: 0 auto;
	}

    .entry_flow_list > li {
        padding: 15px;
    }

    .entry_flow_list > li:not(:last-child) {
        margin-bottom: 30px;
    }

    .entry_flow_list > li:not(:last-child)::after {
        bottom: -43px; /* 矢印の位置調整 */
        border: 15px solid transparent; /* 矢印のサイズ調整 */
        border-top-color: #EA5514; /* 矢印を#EA5514に変更 */
    }

    .entry_flow_head {
        font-size: 1.2em;
        margin-bottom: 0.3em;
		padding-top: 5px;
    }

    .entry_flow_content {
        flex-direction: column; /* 縦並びにする */
        text-align: center; /* テキストと画像を中央寄せ */
        gap: 10px; /* テキストと画像の間隔 */
    }

    .entry_flow_content .entry_flow_text {
        margin-bottom: 15px;
		 margin-top: 15px;
		font-size: 1.6rem;
    }

    .entry_flow_content .entry_flow_image {
        width: 200px; /* SPでの画像の幅を調整 */
        text-align: center; /* 画像を中央寄せ */
    }

    .entry_flow_content .entry_flow_image img {
        margin-left: auto;
        margin-right: auto; /* 中央寄せ */
    }

	#entry_line{
		width: 94%!important;
		margin: 0 auto;
	}

	
    /* 注意事項 */
    #precaution .precaution_title {
        font-size: 1.5em;
        margin-bottom: 30px;
    }


    #entry .entry-bottom-info-wrap {
        flex-direction: column; /* 縦並び */
        gap: 20px;
        margin-top: 40px;
        padding: 0 10px;
    }

    #entry .entry-info-box {
        padding: 20px;
        min-width: unset; /* 最小幅をリセット */
        flex: 1 1 100%; /* フル幅 */
    }

    #entry .entry-info-box .info-box-title {
        font-size: 1.5em;
        padding: 8px 15px;
    }

    #entry .winner-info .info-content-flex {
        flex-direction: column; /* 縦並び */
        text-align: center;
        gap: 15px;
    }

    #entry .winner-info .info-text {
        text-align: center;
    }

    #entry .winner-info .winner-date {
        font-size: 1.2em;
    }

    #entry .winner-info .winner-detail {
        font-size: 0.85em;
    }

    #entry .winner-info .info-image {
        width: 100px;
    }

    #entry .winner-info .info-image img {
        margin: 0 auto;
    }

    #entry .prize-delivery-info .delivery-points {
        gap: 10px;
    }

    #entry .prize-delivery-info .delivery-item {
        flex-direction: column; /* 縦並び */
        gap: 5px;
        text-align: center;
    }

    #entry .prize-delivery-info .delivery-label {
        font-size: 0.9em;
        padding: 6px 10px;
    }

    #entry .prize-delivery-info .delivery-location {
        font-size: 0.85em;
    }

    #entry .prize-delivery-info .delivery-note {
        font-size: 0.8em;
        margin-top: 20px;
    }
	
	.entry_prize-wrap{
		width: 94%;
		margin: 0 auto;
	}
}


#present .cam-content-box{
	background: none;
	padding: 0;
	margin: 0 auto;
}

#present .top_txt {
    text-align: center;
    font-size: 1.2em;
    margin-bottom: 50px;
}

#present .top_txt span{
	color: #FFFF00;
}



/* --- レスポンシブ対応 --- */
@media (max-width: 768px) {
	#present .cam-content-box {
		width: 94%;
		margin: 0 auto;
	}
}

.entry_flow_head .entry_message{
	color: #fff;
	background: #E95513;
	padding: 3px 5px;
	margin: 0 7px;
	font-size: 1.1em;
}