@charset "utf-8";
/* Mail Tikkuna（メールティクナ）専用スタイル */

#mailtikkuna_lp {overflow: hidden;}
#mailtikkuna_lp .mt_inner {width: 1200px;max-width: 92%;margin: 0 auto;}
#mailtikkuna_lp .center {text-align: center;}

/* ---------- Hero ---------- */
#mailtikkuna_lp .mt_hero {
	background-image: linear-gradient(135deg, rgba(22,50,79,0.8) 0%, rgba(31,93,115,0.6) 55%, rgba(47,143,163,0.45) 100%), url(../img/mailtikkuna/fv.webp);
	background-size: cover;
	background-position: center center;
	background-repeat: no-repeat;
	color: #fff;
	padding: 5.5em 0 4.5em 0;
	text-align: center;
}
#mailtikkuna_lp .mt_logo {font-size: 1.4em;font-weight: 700;letter-spacing: 0.05em;margin: 0 0 1.25em 0;}
#mailtikkuna_lp .mt_logo span {display: inline-block;margin-left: 0.75em;font-size: 0.6em;font-weight: 400;letter-spacing: 0.15em;opacity: 0.85;}
#mailtikkuna_lp .mt_catch {font-size: 2.6em;font-weight: 700;line-height: 1.5;margin: 0 0 0.6em 0;}
#mailtikkuna_lp .mt_lead {font-size: 1.125em;line-height: 1.9;margin: 0 0 2em 0;font-weight: 600;}

#mailtikkuna_lp .mt_badges {display: flex;flex-wrap: wrap;justify-content: center;gap: 0.75em;list-style: none;margin: 0 0 0.75em 0;padding: 0;}
#mailtikkuna_lp .mt_badges li {
	display: inline-flex;align-items: center;gap: 0.5em;
	background-color: rgba(255,255,255,0.12);
	border: 1px solid rgba(255,255,255,0.4);
	color: #fff;
	border-radius: 999px;
	padding: 0.6em 1.4em;
	font-size: 0.95em;
	font-weight: 600;
}
#mailtikkuna_lp .mt_badges li i {color: #ffd23f;font-size: 1.1em;}
#mailtikkuna_lp .mt_badges_note {font-size: 0.9em;opacity: 0.85;margin: 0 0 2.5em 0;font-weight: 600;}

#mailtikkuna_lp .mt_stat {
	display: inline-flex;align-items: center;gap: 1.25em;
	background-color: rgba(0,0,0,0.2);
	border-radius: 12px;
	padding: 1.25em 2em;
	margin: 0 0 2.5em 0;
}
#mailtikkuna_lp .mt_stat_num {font-size: 3em;font-weight: 700;color: #ffd23f;line-height: 1;white-space: nowrap;}
#mailtikkuna_lp .mt_stat_num em {font-size: 0.5em;font-weight: 500;margin-left: 0.1em;}
#mailtikkuna_lp .mt_stat_txt {font-size: 0.95em;text-align: left;line-height: 1.6;font-weight: 600;}

#mailtikkuna_lp .mt_cta {margin: 0;}
#mailtikkuna_lp .mt_btn {
	display: inline-block;margin: 0.4em;padding: 0.9em 2.2em;
	border-radius: 4px;font-weight: 700;text-decoration: none;
	transition: all 0.3s;
}
#mailtikkuna_lp .mt_btn_primary {background-color: #B41B1F;color: #fff;}
#mailtikkuna_lp .mt_btn_primary:hover {background-color: #8f1518;}
#mailtikkuna_lp .mt_btn_tel {background-color: #fff;color: #16324f;}
#mailtikkuna_lp .mt_btn_tel i {margin-right: 0.5em;}
#mailtikkuna_lp .mt_btn_tel:hover {background-color: #ffd23f;color: #fff;}

/* ---------- 共通見出し ---------- */
#mailtikkuna_lp .mt_ttl {font-size: 2em;font-weight: 700;margin: 0 0 1.25em 0;position: relative;padding-bottom: 0.7em;}
#mailtikkuna_lp .mt_ttl span {display: block;font-size: 0.42em;font-weight: 500;letter-spacing: 0.1em;color: #999;margin-top: 0.5em;}
#mailtikkuna_lp .mt_ttl::after {content: "";position: absolute;left: 50%;bottom: 0;transform: translateX(-50%);width: 3em;height: 3px;background-color: #b21d23;}
#mailtikkuna_lp .mt_ttl.wh {color: #fff;}
#mailtikkuna_lp .mt_ttl.wh span {color: rgba(255,255,255,0.7);}

/* ---------- ブランドロゴ ---------- */
#mailtikkuna_lp .mt_brand {background-color: #fff;padding: 2.75em 0 1em 0;text-align: center;}
#mailtikkuna_lp .mt_brand_logo {width: 420px;max-width: 60%;height: auto;}

/* ---------- About / OEM ---------- */
#mailtikkuna_lp .mt_about {padding: 0 0 3em 0;}
#mailtikkuna_lp .mt_txt {line-height: 2;}
#mailtikkuna_lp .mt_ttl strong {display: block;line-height: 1;}
#mailtikkuna_lp .mt_ttl mark {font-size: 0.5em;background: linear-gradient(transparent 65%, #ffe38a 65%);color: #000;}

/* ---------- 仕組み ---------- */
#mailtikkuna_lp .mt_flow {padding: 4.5em 0;background-color: #f5f8f9;}
#mailtikkuna_lp .mt_flow_diagram {display: flex;align-items: stretch;justify-content: center;flex-wrap: wrap;gap: 0.5em;margin: 2em 0;}
#mailtikkuna_lp .mt_flow_step {
	background-color: #fff;border: 1px solid #dde5e7;border-radius: 8px;
	padding: 1.75em 1.25em;width: 200px;text-align: center;box-shadow: 0 3px 10px rgba(0,0,0,0.05);
	box-sizing: border-box;
}
#mailtikkuna_lp .mt_flow_step_main {border-color: #2f8fa3;background-color: #eaf5f7;}
#mailtikkuna_lp .mt_flow_step i {font-size: 2em;color: #2f8fa3;margin-bottom: 0.5em;display: block;}
#mailtikkuna_lp .mt_flow_step p {margin: 0;font-size: 0.9em;line-height: 1.6;}
#mailtikkuna_lp .mt_flow_step strong {color: #b21d23;}
#mailtikkuna_lp .mt_flow_arrow {display: flex;align-items: center;justify-content: center;color: #b8c4c7;font-size: 1.75em;width: 2em;}
#mailtikkuna_lp .mt_flow_note {text-align: center;margin: 0;}
#mailtikkuna_lp .mt_flow_note i {color: #2f8fa3;margin-right: 0.5em;}

/* ---------- 特徴 ---------- */
#mailtikkuna_lp .mt_feature {padding: 4.5em 0;background-color: #003;}
#mailtikkuna_lp .mt_feature_grid {display: grid;grid-template-columns: repeat(3, 1fr);gap: 1.5em;}
#mailtikkuna_lp .mt_feature_card {background-color: rgba(255,255,255,0.06);border: 1px solid rgba(255,255,255,0.12);border-radius: 8px;padding: 2em 1.5em;color: #fff;box-sizing: border-box;}
#mailtikkuna_lp .mt_feature_card i {font-size: 1.75em;color: #ffd23f;margin-bottom: 0.6em;display: block;}
#mailtikkuna_lp .mt_feature_card h4 {font-size: 1.125em;margin: 0 0 0.6em 0;}
#mailtikkuna_lp .mt_feature_card p {font-size: 0.9em;line-height: 1.8;margin: 0;color: rgba(255,255,255,0.85);}

/* ---------- 料金 ---------- */
#mailtikkuna_lp .mt_price {padding: 4.5em 0;}
#mailtikkuna_lp .mt_price_box {
	display: flex;justify-content: center;align-items: stretch;flex-wrap: wrap;
	border: 2px solid #16324f;border-radius: 10px;overflow: hidden;max-width: 760px;margin: 0 auto 1.5em auto;
}
#mailtikkuna_lp .mt_price_box dl {flex: 1;margin: 0;padding: 2em;text-align: center;box-sizing: border-box;}
#mailtikkuna_lp .mt_price_box dl:first-child {background-color: #f5f8f9;border-right: 1px solid #dde5e7;}
#mailtikkuna_lp .mt_price_box dt {font-size: 0.95em;font-weight: 600;margin-bottom: 0.75em;}
#mailtikkuna_lp .mt_price_box dd {margin: 0;font-size: 1.25em;font-weight: 700;}
#mailtikkuna_lp .mt_price_main {background-color: #003;color: #fff;}
#mailtikkuna_lp .mt_price_main dt {color: rgba(255,255,255,0.75);}
#mailtikkuna_lp .mt_price_main dd em {font-size: 1.8em;color: #ffd23f;}
#mailtikkuna_lp .mt_price_main dd span {font-size: 0.6em;font-weight: 500;margin-left: 0.25em;}
#mailtikkuna_lp .mt_price_note {text-align: center;font-size: 0.85em;font-weight: 400;margin: 0 0 2em 0;}
#mailtikkuna_lp .mt_price .more_link {background-color: #B41B1F;}

/* ---------- タブレット（〜1024px）：横並びが窮屈になる箇所を先に調整 ---------- */
@media screen and (max-width: 1024px) {
	#mailtikkuna_lp .mt_catch {font-size: 2.1em;}
	#mailtikkuna_lp .mt_feature_grid {grid-template-columns: repeat(2, 1fr);}
	#mailtikkuna_lp .mt_flow_diagram {flex-direction: column;align-items: center;}
	#mailtikkuna_lp .mt_flow_step {width: 80%;max-width: 360px;}
	#mailtikkuna_lp .mt_flow_arrow {width: auto;height: 2em;transform: rotate(90deg);}
}

/* ---------- スマートフォン（〜767px） ---------- */
@media screen and (max-width: 767px) {
	#mailtikkuna_lp .mt_inner {max-width: 90%;}
	#mailtikkuna_lp .mt_hero {padding: 3em 0 2.5em 0;background-image: linear-gradient(135deg, rgba(22,50,79,0.8) 0%, rgba(31,93,115,0.6) 55%, rgba(47,143,163,0.45) 100%), url(../img/mailtikkuna/sp_fv.webp);background-position: center center;}
	#mailtikkuna_lp .mt_logo {font-size: 1.2em;margin-bottom: 1em;}
	#mailtikkuna_lp .mt_logo span {display: block;margin: 0.3em 0 0 0;}
	#mailtikkuna_lp .mt_catch {font-size: 1.6em;line-height: 1.4;}
	#mailtikkuna_lp .mt_lead {font-size: 0.95em;line-height: 1.7;}
	#mailtikkuna_lp .mt_badges {gap: 0.5em;}
	#mailtikkuna_lp .mt_badges li {font-size: 0.8em;padding: 0.5em 1em;}
	#mailtikkuna_lp .mt_badges_note {font-size: 0.8em;}
	#mailtikkuna_lp .mt_stat {flex-direction: column;gap: 0.5em;text-align: center;padding: 1.25em 1.5em;width: 88%;box-sizing: border-box;}
	#mailtikkuna_lp .mt_stat_num {font-size: 2.4em;}
	#mailtikkuna_lp .mt_stat_txt {text-align: center;}
	#mailtikkuna_lp .mt_btn {display: block;width: 90%;margin: 0.5em auto;box-sizing: border-box;}

	#mailtikkuna_lp .mt_ttl {font-size: 1.5em;}
	#mailtikkuna_lp .mt_ttl span {font-size: 0.5em;}
	#mailtikkuna_lp .mt_ttl mark {font-size: 0.7em;}

	#mailtikkuna_lp .mt_brand {padding: 2em 0 0.75em 0;}
	#mailtikkuna_lp .mt_brand_logo {width: 300px;max-width: 80%;}

	#mailtikkuna_lp .mt_about {padding: 0 0 2em 0;}
	#mailtikkuna_lp .mt_txt {line-height: 1.8;text-align: left;}

	#mailtikkuna_lp .mt_flow {padding: 3em 0;}
	#mailtikkuna_lp .mt_flow_step {width: 92%;max-width: none;padding: 1.5em 1em;}

	#mailtikkuna_lp .mt_feature {padding: 3em 0;}
	#mailtikkuna_lp .mt_feature_grid {grid-template-columns: 1fr;gap: 1em;}
	#mailtikkuna_lp .mt_feature_card {padding: 1.5em 1.25em;}

	#mailtikkuna_lp .mt_price {padding: 3em 0;}
	#mailtikkuna_lp .mt_price_box {flex-direction: column;}
	#mailtikkuna_lp .mt_price_box dl {padding: 1.5em;}
	#mailtikkuna_lp .mt_price_box dl:first-child {border-right: none;border-bottom: 1px solid #dde5e7;}
	#mailtikkuna_lp .mt_price_main dd em {font-size: 1.6em;}
}

/* ---------- 小型スマートフォン（〜374px） ---------- */
@media screen and (max-width: 374px) {
	#mailtikkuna_lp .mt_catch {font-size: 1.4em;}
	#mailtikkuna_lp .mt_badges li {font-size: 0.72em;padding: 0.45em 0.85em;}
	#mailtikkuna_lp .mt_stat_num {font-size: 2em;}
	#mailtikkuna_lp .mt_btn {padding: 0.85em 1em;}
}
