@charset "UTF-8";

html {font-size: 62.5%;}

*, *::before, *::after {
    box-sizing: border-box;
}




/* ◆フォント読み込み */

.zen-kaku-gothic-new-regular {
  font-family: "Zen Kaku Gothic New", sans-serif;
  font-weight: 400;
  font-style: normal;
}

.zen-old-mincho-semibold {
  font-family: "Zen Old Mincho", serif;
  font-weight: 600;
  font-style: normal;
}




/* ◆デフォ文字 */
body {
    margin: 0;
    padding: 0;
    font-size: 16px;
    font-family: "Zen Old Mincho", serif;
    line-height: 1.8;
    color: #43311f;         /* ✒️ */
}




/* ◆ヘッダーデザイン */
.site-header {  /* 配置 */
    position: fixed;
    top: 0;
    left: 0;
    display: flex;
    align-items: center;
    z-index: 1000;
    width: 100%;
    padding: 5px;
    border-bottom: 0.5px solid #0a3321;         /* ✒️🟩 */
    background-color: #fffcf5;         /* ✒️背景 */
}


.h1-text-area {  /* タイトル下揃え */
    display: flex;
    align-items: baseline;
}


.h1-text {  /* ヘッダーベース文字 */
    margin: 0;
    font-size: clamp(18px, 2vw, 25px);
    font-family: "Yu Gothic Medium", "Yu Gothic", "Hiragino Kaku Gothic ProN", "Hiragino Sans", "Noto Sans JP", sans-serif;
    font-weight: bold;
    letter-spacing: 0.08em; 
    color: #0a3321;         /* ✒️🟩 */
}


.h1-text2 {  /* ヘッダー「・」用 */
    margin: 0;
    font-size: clamp(18px, 2vw, 25px);
    font-family: "Yu Gothic Medium", "Yu Gothic", "Hiragino Kaku Gothic ProN", "Hiragino Sans", "Noto Sans JP", sans-serif;
    font-weight: bold;
    letter-spacing: -0.15em; 
    color: #0a3321;         /* ✒️ 🟩*/
}


.header-icon {  /* ヘッダーアイコン */
    display: inline-block;

    background-image: url("logo1.png");
    background-size: contain;
    background-position: center;
    background-repeat: no-repeat;

    width: clamp(48px, 5vw, 60px);
    aspect-ratio: 1 / 1;
    margin: 0px 12px 0px clamp(1px, 5vw, 300px);
	/* 念のためスマホ保存ブロック */
    pointer-events: none;
    user-select: none;
    -webkit-touch-callout: none;
}




/* ◆各ブロック（事業内容やプロフィール）の余白を設定 */

.section-box {height: clamp(80px, 10vw, 120px);}


.section-box2 {
    padding: 30px 40px 60px 40px;
    text-align: center;
}


.text-box {
    width: fit-content;
    margin: 0 auto;
    padding: 0px 10px;
    text-align: left;
}


.text-box2 {
    display: inline-block;
    margin: 0 auto;
    margin-top: 10px;
    text-align: left;
}


.text-box3 {
    width: 95%;
    max-width: 420px;
    margin: 0 auto;
    text-align: left;
}

.text-box4 {
    width: 95%;
    max-width: 600px;
    margin: 0 auto;
    text-align: left;
}



/* ◆各種テキスト */

.text1 {  /* キャッチコピー文字 */
    margin: 0;
    padding: 0;
    font-size: clamp(30px, 3vw, 80px);
    font-family: "Zen Old Mincho", serif;
    font-weight: bold;
    line-height: 1.4;
    color: #0a3321;         /* ✒️🟩 */
}


.text1-2 {  /* キャッチコピー文字 */
    color: #82202b;         /* ✒️アクセント */
}


.text2 {  /* キャッチコピー説明文字 */
    font-size: clamp(18px, 1.5vw, 20px);
    font-family: "Zen Kaku Gothic New", sans-serif;
}


.text-name{
    font-size: clamp(18px, 1.2vw, 22px);
}


h2 {
    padding-bottom: 8px;
    border-bottom: 2px solid #0a3321;         /* ✒️🟩 */
    font-size: clamp(24px, 2vw, 35px);
    font-family: "Zen Old Mincho", serif;
    font-weight: bold;
    color: #0a3321;          /* ✒️🟩 */
}


p {
    font-family: "Zen Kaku Gothic New", sans-serif;
}


a{
    color: #82202b;         /* ✒️アクセント */
}



/* ◆背景色変更 */

.bg1 {background-color: #fffcf5; }         /* ✒️ */

.bg2 {background-color: #eff5e4; }         /* ✒️ */




/* ◆写真データ */

.photo {
    display: inline-block;
    background-image: url("pic1.jpg");
    background-size: 100% auto;
    background-position: center;
    background-repeat: no-repeat;

    width:clamp(250px, 18vw, 500px);
    aspect-ratio: 1 / 1;
    margin: 20px 2.5vw 0 auto;
	/* 念のためスマホ保存ブロック */
    pointer-events: none;
    user-select: none;
    -webkit-touch-callout: none;
}


.contact {
    display: inline-block;
    background-image: url("contact.png");
    background-size: 100% auto;
    background-position: center;
    background-repeat: no-repeat;

    width: 230px;
    aspect-ratio: 4 / 1;
    margin-top: 20px;
	/* 念のためスマホ保存ブロック */
    pointer-events: none;
    user-select: none;
    -webkit-touch-callout: none;
}