@charset "UTF-8";
@import url("/css/initialize.css?date=20251031");
@import url("/css/general.css?date=20251031");
@import url("/css/margin.css?date=20251031");

#lp-banner img {
	margin: 20px auto 0;
}
#lp-banne a {
	padding-top: 50px;
}
/* --------------------------------
	#news_ticker お知らせマーキー
-------------------------------- */
#vticker {
	background-color: #fed900;
	padding: 10px 0;
	margin-top: 10px;
}
#news_ticker {
	background-color: #fff;
	margin: 0 auto;
	box-shadow: 0px 0px 10px 0px rgba(0,0,0,0.1) inset;
}
#news_ticker ul {
	width: 100%;
	text-align: center;
}
#news_ticker ul li p {
	padding: 10px;
}
#news_ticker .category {
	background-color: #f18d00;
	color: #fff;
	padding: 3px 10px;
	margin-left: 10px;
	font-size: 88%;
	display: inline-block;
}

/* --------------------------------
	corner
-------------------------------- */
.corner-title,
.corner-detail {
	text-indent: -9999px;
	margin: 40px 0;
}
.corner-home {
	background: url('/images/top/corner-home_bg.png') left top repeat-x;
	width: auto;
	height: 80px;
}
.corner-content {
	padding: 30px 0 40px 0;
	background-color: #fef5e8;
}
.corner-imgbox img {
	margin-bottom: 5px;
}
.corner-imgbox span {
	display: block;
}
.corner-btn {
	text-align: center;
	margin-bottom: 70px;
}
.corner-btn img {
	margin-bottom: 20px;
}
.corner-btn a {
	display: block;
	width: 600px;
	margin: 0 auto;
	padding: 18px 0;
	border: solid 1px #333;
	font-size:135.71%;
	font-weight: 600;
	font-family: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro";
}
.corner-btn a:hover {
	border: solid 1px #cc0000;
	background-color: #fffcfc;
	text-decoration: none;
}
.map-btn {
	background-color: #f18d00;
	padding: 25px 0;
}
.map-btn a {
	border: 0;
	background-color: #fff;
}
.map-btn a:hover {
	border: 0;
	color: #333;
	text-decoration: underline;
}

/* --------------------------------
	#voice-area オーナーインタビュー
-------------------------------- */
.voice-cap {
	font-size:135.71%;
	font-weight: 600;
	color: #f18d00;
	font-family: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro";
	border-left: 4px solid #f18d00;
	padding-left: 12px;
	margin-bottom: 20px;
}
.voice-point {
	background-color: #f18d00;
	color: #fff;
	font-size: 105.71%;
	padding: 8px 14px;
}
.voice-area p {
	margin-top: 20px;
	font-size: 105.71%;
	line-height: 1.8;
}
.voice-area {
	position:relative;
	margin-top: 40px;
}
.voice_q1:after,
.voice_q2:after {
	content: '';
	display: block;
	height: 1px;
	width: 540px;
	position: absolute;
	bottom:0 ;
	background: #f18d00;
}
.voice_q1:after {
	left: 0%;
}
.voice_q2:after {
	right: 0%;
}
.voice-list_box {
	background-color: #fef5e8;
	border: 1px solid #f18d00;
	text-align: center;
	padding: 20px;
	margin-top: 10px;
}
.voice-list_box a {
	font-size:135.71%;
	font-weight: 700;
}

/* --------------------------------
	#news お知らせ
-------------------------------- */
#news {
	padding: 50px 0;
	text-align: center;
}
#news li {
	font-size: 105.71%;
	border-bottom: 1px dotted #eee;
	margin-top: 20px;
	padding-bottom: 20px;
}
#news .date {
	display: block;
	margin-bottom: 5px;
}
#news .category {
	background-color: #f18d00;
	color: #fff;
	padding: 3px 10px;
	margin-left: 10px;
	font-size: 90%;
	display: inline-block;
}

/* --------------------------------
	#newopen 新店舗情報
-------------------------------- */
#newopen {
	padding: 30px 0;
	margin-bottom: 30px;
	background-color: #FFF8EF;
	text-align: center;
}

/* --------------------------------
	#review 独立開業をご検討中の皆さまへ
-------------------------------- */
#review p,
#takeout p,
#merit p {
	font-size: 106.71%;
	line-height: 1.6;
	margin-bottom: 30px;
}
#review .contents-title-t,
#takeout .contents-title-t {
	margin-bottom: 30px;
}
#review img {
	margin-bottom: 30px;
}

/* --------------------------------
	#review 独立開業をご検討中の皆さまへ
-------------------------------- */
#merit .contents-title-t {
	margin-bottom: 16px;
}
#merit p {
	background-color: #f6f6f6;
	padding: 20px;
	border: 1px solid #ccc;
}
#merit p.merit {
	background-color: #fefaf3;
	border: 1px solid #facd89;
}
#merit span.de-merit {
	color: #5192ce;
}
#merit span.merit {
	color: #f18d00;
}

/* --------------------------------
	#owner-apply フランチャイズ募集
-------------------------------- */
#apply {
	background-color: #d3edfb;
	padding-top: 50px;
	text-shadow: 1px 1px 1px #fff;
}
#cloud {
	background: url('/images/top/apply_illust01.png') center top no-repeat,
				url('/images/top/apply_illust02.png') left bottom no-repeat;
	padding-bottom: 50px;
}
#owner-apply p {
	font-size: 105.71%;
	line-height: 2.0;
}
#owner-apply .emphasis {
	color: #dc063b;
	font-weight: 700;
}
#owner-apply #owner_list-btn {
	margin: 30px 0 35px 0;
}
#owner-apply #owner_list-btn a {
	display: block;
	width: 80%;
	margin: 0 auto;
	padding: 18px 0;
	background-color: #fff;
	text-align: center;

	font-size:135.71%;
	font-weight: 600;
	font-family: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro";
}
#owner-apply .sub-title {
	font-size:135.71%;
	font-weight: 700;
	font-family: "FP-ヒラギノ丸ゴ StdN W5", "FP-HiraMaruStdN-W5";
}
#owner-apply .apply-desc {
	background-color: #fff;
	padding: 10px;
}

/* PC SIZE */
@media screen and (min-width: 980px){

	.parallax-window {
	    min-width: 100%;
	    height: 640px;
	    background: transparent;
	}
	.illust01-title {
		width: 773px;
		margin: 30px auto 25px;
	}
	#kokokara_illust {
		background: url('/images/top/illust01_03.png') center 0px repeat-x;
/* 		background-color: "#fef5e8"; */
	}
	#building {
 		background: url('/images/top/illust01.png') center 0px no-repeat;
		/*background-size:100% auto;*/
		height: 480px;
	}
	.corner-title.p1 { background: url('/images/top/corner-ttl_p1.png') center top no-repeat; height: 56px; }
	.corner-detail.p1 { background: url('/images/top/corner-de_p1.png') center top no-repeat; height: 33px; }
	.corner-title.p2 { background: url('/images/top/corner-ttl_p2.png') center top no-repeat; height: 60px; }
	.corner-detail.p2 { background: url('/images/top/corner-de_p2.png') center top no-repeat; height: 33px; }
	.corner-title.p3 { background: url('/images/top/corner-ttl_p3.png') center top no-repeat; height: 56px; }
	.corner-detail.p3 { background: url('/images/top/corner-de_p3.png') center top no-repeat; height: 28px; }
	.corner-title.p4 { background: url('/images/top/corner-ttl_p4.png') center top no-repeat; height: 56px; }
	.corner-detail.p4 { background: url('/images/top/corner-de_p4.png') center top no-repeat; height: 31px; }
	.corner-title.p5 { background: url('/images/top/corner-ttl_p5.png') center top no-repeat; height: 56px; }
	.corner-detail.p5 { background: url('/images/top/corner-de_p5.png') center top no-repeat; height: 31px; }

	.corner-imgbox li {
		float: left;
		margin-left: 10px;
	}
	.corner-imgbox li:first-child {
		margin-left: 0;
	}
	.corner-content .p3 {
		background: url('/images/top/illust03_01.png') left top no-repeat;
		height: 433px;
	}
	.corner-content .p3 > p {
		padding: 130px 0 0 680px;
		font-size: 115.71%;
		line-height: 1.7;
	}
	.corner-content { background-color: #fef5e8; }

/* --------------------------------
	オーナーインタビュー
-------------------------------- */
	.voice-area {
		min-height: 260px;
	}
	.voice_q1 {
		background: url('/images/top/voice_illust01.png') left top no-repeat;
		padding: 20px 0 0 220px;
	}
	.voice_q2 {
		background: url('/images/top/voice_illust02.png') 700px top no-repeat;
		padding: 20px 0 0 0;
	}
	.voice_q4 {
		background: url('/images/top/voice_illust04.png') left top no-repeat;
		padding: 20px 0 0 220px;
	}
	.voice_q2 p { max-width: 640px; }
	.voice_q3 {
		background: url('/images/top/voice_illust03.png') left top no-repeat;
		padding: 20px 0 0 220px;
	}
	.voice_q5 {
		background: url('/images/top/voice_illust05.png') 700px top no-repeat;
		padding: 20px 0 0 0;
	}

}

/* SMARTPHONES SIZE */
@media screen and (max-width: 980px){
	
	/*  news-area ニュースエリア
	--------------------------------------------- */
	#news-area {
		padding: 50px 0;
		text-align: center;
	}
	#news-area .list-item {
	    opacity: 1;
        text-align: left;
		font-size: 105.71%;
		border-bottom: 1px dotted #eee;
		margin-top: 20px;
		padding-bottom: 20px;
	}
	#news-area .date {
		display: block;
		margin-bottom: 5px;
	}
	#news-area .category {
		background-color: #f18d00;
		color: #fff;
		padding: 3px 10px;
		margin-left: 10px;
		font-size: 90%;
		display: inline-block;
	}
	#news-area .list-item.is-hidden {
	    display:none;
	}
	#news-area .list-btn {
	    margin-top: 20px;
	    text-align: center;
	}
	#news-area .list-btn.is-btn-hidden {
	    display:none;
	}
	#news-area .list-btn button {
	    background-color: #cb3540;
	    font-size: 16px;
	    color:#fff;
	    border: none;
	    cursor: pointer;
	    outline: none;
	    padding: 0;
        height: 34px;
        line-height: 34px;
	    width: 160px;
        display: inline-block;
	
	    border-radius: 4px;
	    -webkit-border-radius: 4px;
	    -moz-border-radius: 4px;
	}

	/* トップニュース */
	#vticker {
		background-color: #fed900;
		padding: 10px 0;
		margin-top: 0;
	}
	#vticker .wpr {
		width: 96%;
	}
	#news_ticker ul { width: 100%; }
	#news_ticker li { text-align: left; }
	#news li { text-align: left; }

	.corner-title,
	.corner-detail { margin: 24px 0; }
	.corner-content { text-align: center; }
	.corner-imgbox li {	margin-top: 20px; }
	.corner-imgbox li:first-child {
		margin-top: 0px;
	}
	.corner-imgbox img {
		width: 50%;
		width: 50vw;
	}
	.corner-btn a {	width: 90%; }
	.corner-home {
		background: url('/images/top/corner-home_bg.png') left top repeat-x;
		background-size: cover;
		height: 60px;
	}
	#threeH-head {
		font-size: 145.71%;
		font-weight: 700;
		line-height: 1.7;
		color: #f18d00;
	}
	#threeH-p {
		font-size: 115.71%;
		line-height: 1.7;
	}
	#threeH-p span {
		color: #df043a;
		font-weight: 700;
	}
	#owner-apply #owner_list-btn a {
		width: 100%;
	}
	#merit p {
		width: 84%;
	}
/* --------------------------------
	オーナーインタビュー
-------------------------------- */
	.voice-area p {
		padding-bottom: 20px;
	}
	.voice_q1:after,
	.voice_q2:after {
		width: 100%;
	}
	.voice-list_box { width: auto; }
	.apply-desc { width: auto; }

	.parallax-window {
		overflow: hidden;
		color: rgb(250,250,250);
		min-height: 360px;
		background-size: contain;
	}

}
/* SMALL SMARTPHONES SIZE */
@media screen and (max-width: 480px){
	#vticker .wpr {
		width: 94%;
		margin: 0 auto;
	}
	#news_ticker ul li p {
		padding: 10px 3%;
		line-height: 1.4;
	}
}
@media screen and (max-width: 350px){
}













/* --------------------------------
	#owner-open 説明会のご案内
-------------------------------- */

.owner-open .contents-title-t {
	padding: 30px 0 20pt;
}
/* SMARTPHONES SIZE */
@media screen and (max-width: 767px){
	.owner-open .contents-title-t {
		padding: 0 0 10pt;
	}
}
.owner-wpr {
	background-color: #B92F16;
	text-align: center;
}

#owner-open .contents-title-t {
	color: #fff;
	padding-bottom: 30px;
}

.new-open-list {
    display: flex;
    justify-content: center;
    gap: 20px;
    padding: 40px 0px;
}
/* SMARTPHONES SIZE */
@media screen and (max-width: 767px){
	.new-open-list {
		padding: 20px 0px;
	}
}

.new-open-list .open-box {
    width: 50%;
    border: none;
}
/* SMARTPHONES SIZE */
@media screen and (max-width: 767px){
	.new-open-list .open-box {
		width: 100%;
	}
}

.new-open-list .open-box-inner {
    background-color: #fff;
    border-radius: 15px;
    padding: 24px;
    height: 100%;
    box-sizing: border-box;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    text-align: left; /* 親のcenterを打ち消し */
}

.new-open-list .box-head {
    color: #B92F16;
    font-size: 34px;
    line-height: 1.2;
    margin-bottom: 6px;
}

.new-open-list .box-title {
    color: #000;
    font-size: 2em;
	font-family: "FP-ヒラギノ角ゴ StdN W7";
    line-height: 1.35;
    margin-bottom: 18px;
}

.new-open-list .box-title .point {
	color: #B92F16;
	font-size: 1.1em;
}

.new-open-list .image {
	text-align: center;
}
.new-open-list .image img {
    width: 80%;
    height: auto;
    max-height: none;
}
.new-open-list .content {
	margin-top: 20px;
	font-size: 1.2em;
	line-height: 1.6;
}

/* --- 説明会スペック行（参加費用/所要時間/開催場所） --- */
.spec-list { margin: 10px 0 0 }
.spec-row {
	display: flex;
	align-items: center;
	gap: 20px;
	margin: 14px 0 0;
}
.spec-label {
	background-color: #B92F16;
	color: #fff;
	border-radius: 10px;
	padding: 10px 18px;
	font-size: 1.2em;
	line-height: 1;
	white-space: nowrap;
}
.spec-value {
	font-size: 1.2em;
	line-height: 1.2;
}

.new-open-list .open-btn {
    margin-top: 20px;
    padding: 0;
}
.new-open-list .open-btn a {
    display: block;
    width: 100%;
    padding: 18px 20px;
    background-color: #B92F16;
    color: #fff;
    text-align: center;
    font-size: 1.9em;
    text-decoration: none;
    border-radius: 9999px; /* ピル型 */
    box-shadow: none; /* 影なし */
	font-family: "FP-ヒラギノ角ゴ StdN W5";
}
.new-open-list .open-btn a:hover {
    background-color: #a42b15;
    text-decoration: none;
}
.new-open-list .search-btn a {
    padding: 14px 20px;
	background-color: #007A96;
	font-size: 1.5em;
}
.new-open-list .search-btn a:hover {
    background-color: #023A58;
    text-decoration: none;
}

@media screen and (max-width: 767px){
    .new-open-list {
        flex-direction: column;
        align-items: center;
        gap: 20px;
    }
    .new-open-list .open-box {
        width: 95%;
    }
	.new-open-list .open-box-inner {
		padding: 15px;
	}
    .new-open-list .box-title {
        font-size: 1.6em
    }
	.new-open-list .box-title .point {
		font-size: 1.3em;
	}
    .new-open-list .open-btn a {
        font-size: 1.5em;
        padding: 18px 16px;
    }
	.spec-row { gap: 14px; }
	.spec-label { font-size: 1em; padding: 8px 12px; }
	.spec-value { font-size: 1.2em; }
}

/* --------------------------------
	#catch-message キャッチメッセージ
-------------------------------- */

#catch-message {
	padding: 40px 0;
	line-height: 1.3;
	text-align: center;
}
#catch-message .point {
	color: #B92F16;
	font-size: 1.1em;
}
/* SMARTPHONES SIZE */
@media screen and (max-width: 767px){
	#catch-message h1 {
		font-size: 1.7em;
		line-height: 1.7;
	}
	#catch-message .point {
		font-size: 1.0em;
	}
}

/* --------------------------------
	#hokka-commitment ほっかほっか亭のこだわり
-------------------------------- */

#hokka-commitment {
	padding: 20px 0 80px;
}

.commitment-wpr {
	text-align: center;
}

.commitment-subtitle {
	font-size: 1.2em;
	line-height: 1.8;
	margin-top: 30px;
	margin-bottom: 60px;
}
/* SMARTPHONES SIZE */
@media screen and (max-width: 767px){
	.commitment-subtitle {
		text-align: left;
	}
}

/* PC SIZE */
@media screen and (min-width: 980px){
	.commitment-content {
		display: flex;
		align-items: flex-start;
		gap: 40px;
		margin: 0 auto;
	}
	.commitment-images {
		flex: 0 0 53%;
		position: relative;
	}
}

.commitment-image-main {
	margin-bottom: 20px;
}

.commitment-image-main img {
	width: 100%;
	height: auto;
}

.commitment-image-sub {
	width: 70%;
	margin-left: auto;
}

.commitment-image-sub img {
	width: 100%;
	height: auto;
}

.commitment-text {
	flex: 1;
	text-align: left;
}

fieldset.text-item {
	margin-bottom: 25px;
	border: 1px solid #ff7b00;
	border-radius: 8px;
	padding: 10px 20px 20px 20px;
	background-color: rgba(255, 123, 0, 0.05);
}
/* SMARTPHONES SIZE */
@media screen and (max-width: 767px){
	fieldset.text-item {
		padding: 8px 5px 14px;
	}
}

legend.text-heading {
	font-size: 1.7em;
	font-family: "FP-ヒラギノ角ゴ StdN W7";
	line-height: 1.4;
	padding: 0 10px;
	margin-bottom: 0;
}

legend.text-heading.orange {
	color: #ff7b00;
}

fieldset.text-item p {
	font-size: 1.2em;
	line-height: 1.8;
	margin: 0;
}

.highlight.orange {
	color: #ff7b00;
	font-family: "FP-ヒラギノ角ゴ StdN W7";
}

.commitment-btn {
	margin-top: 40px;
}

.commitment-btn a {
	display: block;
	width: 100%;
	background-color: #B92F16;
	color: #fff;
	padding: 18px 40px;
	border-radius: 8px;
	text-decoration: none;
	font-size: 1.4em;
	transition: background-color 0.3s;
	text-align: center;
	box-sizing: border-box;
}

.commitment-btn a:hover {
	background-color: #a42b15;
}

/* SP対応 */
@media screen and (max-width: 767px) {
	#hokka-commitment {
		padding: 20px 0 60px;
	}
	
	.commitment-title {
		font-size: 2em;
	}
	
	.commitment-subtitle {
		font-size: 1.2em;
		margin-bottom: 20px;
		order: 10;
	}

	.commitment-text {
		padding-top: 20px;
	}
	
	.commitment-content {
		flex-direction: column;
		gap: 40px;
	}
	
	.commitment-images {
		flex: none;
		width: 100vw;
		order: -1;
		margin-left: calc(-50vw + 50%);
		overflow: hidden;
	}
	
	.commitment-image-main {
		margin-bottom: 20px;
		width: 100%;
	}
	
	.commitment-image-main img {
		width: 100%;
		height: auto;
		object-fit: cover;
	}
	
	.commitment-text {
		text-align: center;
	}
	
	legend.text-heading {
		font-size: 1.5em;
	}
	
	fieldset.text-item p {
		font-size: 1.2em;
		line-height: 1.8;
	}
}
/* SP対応 */
@media screen and (max-width: 767px) {
}

/* --------------------------------
	#safety-system ほっかほっか亭の安心制度
-------------------------------- */

/* PC SIZE */
@media screen and (min-width: 980px){
	#safety-system .corner-area {
		padding: 20px 0;
		margin-top: 40px;
		background-color: #FFF8EF;
		text-align: center;
	}
}
#safety-system .safety-title {
	font-size: 1.8em;
	padding-bottom: 30px;
	font-family: "FP-ヒラギノ角ゴ StdN W7";
}
/* SMARTPHONES SIZE */
@media screen and (max-width: 767px){
	#safety-system .safety-title {
		padding-bottom: 10px;
		line-height: 1.5;
	}
}
/* PC SIZE */
@media screen and (min-width: 980px){
	#safety-system .right .safety-title {
		text-align: right;
	}
}
#safety-system .safety-description {
	font-size: 1.2em;
	line-height: 1.6;
}
#safety-system .safety-content {
	padding: 20px 0 10px;
	text-align: left;
}
/* PC SIZE */
@media screen and (min-width: 980px){
	#safety-system .safety-description {
		max-width: 520px;
	}
	#safety-system .right .safety-description {
		margin-left: 480px;
	}
}
#safety-system .safety-description .point {
	background-color: #FFDEB1;
	padding: 2px;
	border-radius: 4px;
	font-family: "FP-ヒラギノ角ゴ StdN W7";
	color: #B92F16;
}
#safety-system .image-box {
	text-align: center;
	margin-bottom: 30px;
}
/* SMARTPHONES SIZE */
@media screen and (max-width: 767px){
	#safety-system .image-box {
		padding-top: 50px;
		margin-bottom: 0;
	}
}

/* PC SIZE */
@media screen and (min-width: 980px){
	#safety-system .image-box img {
		width: 500px;
		height: auto;
		max-height: none;
		position: absolute;
		margin-top: 105px;
		margin-left: 60px;
		overflow: hidden;
	}
	#safety-system .right .image-box img {
		margin-left: -560px;

	}
}

#safety-system .links-btn a {
	display: block;
	width: 350px;
	padding: 15px 0;
	margin-top: 30px;
	background-color: #B92F16;
	color: #fff;
	text-align: center;
	font-size: 1.4em;
	text-decoration: none;
	border-radius: 10px; /* ピル型 */
	box-shadow: none; /* 影なし */
	font-family: "FP-ヒラギノ角ゴ StdN W5";
}
/* SMARTPHONES SIZE */
@media screen and (max-width: 767px){
	#safety-system .links-btn a {
		margin-top: 10px;
		width: 100%;
	}
}
#safety-system .links-btn a:hover {
    background-color: #a42b15;
    text-decoration: none;
}

/* PC SIZE */
@media screen and (min-width: 767px){
	#safety-system .right .links-btn a {
		margin-left: 480px;
	}
	#safety-system .safety-box {
		position: relative;
		min-height: 370px;
	}
	#safety-system .training-center img {
		float: right;
		margin-left: 20px;
	}
}

#safety-system .training-center {
	-moz-border-radius: 0.8em;
	-webkit-border-radius: 0.8em;
	-o-border-radius: 0.8em;
	-ms-border-radius: 0.8em;	
    border-radius: 0.8em;
    background-color: #ecf7ea;
    padding: 30px;
   	display: inline-block;
   	margin: 40px 0;
}
#safety-system .training-center .tc-title {
	font-size: 1.8em;
	font-family: "FP-ヒラギノ角ゴ StdN W7";
	color: #3eb134;
	margin-bottom: 15px;
}
/* SMARTPHONES SIZE */
@media screen and (max-width: 767px){
	#safety-system .training-center .tc-title {
		font-size: 1.8em;
		padding-top: 20px;
	}
}
#safety-system .links-btn a:hover {
    background-color: #a42b15;
    text-decoration: none;
}
#safety-system .training-center p {
	font-size: 1.2em;
	line-height: 1.5;
}