html, body {
    margin: 0;
    padding: 0;
    width: 100%;
    height: 100%; /* 高さを100%に設定 */
    overflow-x: hidden;  /* 横スクロールを防止 */
    overflow-y: auto;    /* 縦スクロールを有効に */
}

/* PCおよびタブレット（768px以上） */
@media screen and (min-width: 768px) {
    body {
        background-image: url("../img/background.png"); /* 背景画像設定 */
        background-size: cover;
        background-repeat: no-repeat;
        background-position: center top;
        min-height: 100%;
    }

	.center-content {
		display: flex;
		justify-content: center;        /* 横方向中央寄せ */
		align-items: center;            /* 縦方向中央寄せ（上寄せにしたい場合は flex-start） */
		flex-direction: column;
		max-width: 1200px;
		margin: 0 auto;
/*
		padding: 10px 20px;
		min-height: 100vh;
*/
	}

	.center-content picture {
		width: 100%;
/*		max-width: 1200px;              /* 中央に収めたい最大幅を指定 */
		max-width: 840px;              /* 中央に収めたい最大幅を指定 */
/*		max-width: 900px;*/
		
		margin: 0 auto;                 /* 明示的に中央寄せ */
	}
    /* タブレット用に画像の上マージンを調整 */
    .center-content img {
        width: 100%;       /* 幅100%でリキッドに伸び縮み */
        height: auto;
        display: block;
        margin-top: 0; /* 上寄せにするため、上マージンは削除 */
    }

    /* ボタン画像の配置（タブレットとPCは同様に横並び） */
    .button-container {
        display: flex;
        justify-content: center;
        gap: 15px;  /* ボタン間隔を少し小さく 
/*        gap: 0px;  /* ボタン間隔を少し小さく */
		margin-top: 20px;
    }

	.new_cv_button_01, .new_cv_button_02{
        width: 100%;
		height:100%;
	}

	.new_cv_button_01 {
		padding-top:20px;		
	}

	.new_cv_button_02 {
		padding-top:10px;		
	}

	
    .button {
        width: 100%;
        max-width: 420px;  /* タブレット用にボタンの幅を少し小さく */
        height: auto;
        object-fit: contain;
        cursor: pointer;
    }

    /* PCおよびタブレットのみ表示 */
    .pc-tablet-only {
        display: flex;  /* PCおよびタブレット版でのみ表示 */
    }

    /* スマホ版では非表示 */
    @media screen and (max-width: 767px) {
        .pc-tablet-only {
            display: none;  /* スマホ版で非表示 */
        }
    }	

    /* フッターとコピーライト */
    .footer {
        text-align: center;
        margin-top: 20px;
    }

    .site-link {
        font-family:"Hiragino W4", sans-serif;
        font-size: 12px;
        color: #FFFFFF;
        text-decoration: none;
    }

    .copyright {
        font-family: "Hiragino W4", sans-serif;
        font-size: 14px;
        color: #FFFFFF;
        margin-top: 20px;
    }

    /* スマホ用の画像とボタンは表示しない */
    .mobile-only {
        display: none;  /* PCおよびタブレットでは非表示 */
    }
}


@media screen and (min-width: 1280px) {
    .floating-buttons {
        position: fixed;
        bottom: 30px;
        right: 30px;
        display: flex;
        flex-direction: column;
        gap: 10px;
/*		gap: 0px;*/
        z-index: 1000;
    }

    .floating-buttons img {
        width: 180px; /* 画像ボタンの幅（必要に応じて調整） */
        height: auto;
        box-shadow: 0 4px 10px rgba(0, 0, 0, 0.3);
        border-radius: 8px;
        cursor: pointer;
        transition: transform 0.2s;
    }

    .floating-buttons img:hover {
        transform: scale(1.05);
    }
}

@media screen and (min-width: 768px) and (max-width: 1199px) {
    .center-content {
        max-width: 100%;      /* 左右マージンをなくす */
        padding: 0;           /* パディングも削除 */
        min-height: auto;     /* 余白の原因となる100vhを解除 */
    }

    .button-container {
/*        flex-direction: row;*/ /* 横並びに戻す */

		
		justify-content: center;
        gap: 15px;
/*        gap: 0px;*/
		margin-top: 20px;
    }

    .button {
        max-width: 500px;     /* ボタンの最大幅を調整 */
        width: 100%;
    }
}

@media screen and (max-width: 1279px) {
    .floating-buttons {
        display: none !important;
    }
}

/* スマホ用レスポンシブデザイン */
@media screen and (max-width: 767px) {
    body {
        background-image: url("../img/background-mobile.png");
        background-size: cover;
        background-repeat: no-repeat;
        background-position: center top;
    }

    .center-content {
        display: flex;
        justify-content: center;
        align-items: start;
        flex-direction: column;
        width: 100%;
        padding: 10px 0;
        min-height: auto;
    }

	/* スマホ版では非表示 */
	.pc-tablet-only {
		display: none;  /* スマホ版で非表示 */
	}

    /* スマホ用の画像 */
    .center-content img {
        width: 100%;       /* 幅100%に設定 */
        height: auto;      /* 高さは自動調整 */
        display: block;
    }

    /* 新たに追加する画像（スマホのみ） */
    .mobile-only {
        display: block;  /* スマホ版でのみ表示 */
    }

    .mobile-image {
        width: 100%;  /* 幅100%に調整 */
        height: auto; /* 高さ自動調整 */
        margin-top: 20px;  /* 画像間に余白を加える */
    }

    /* ボタン画像の配置 */
    .button-container {
        display: flex;
        flex-direction: column; /* ボタンを縦に並べる */
        justify-content: center;
        align-items: center;
        gap: 0px;
		/* margin-top: 20px; */
		margin-top: 0px;
		padding-left: 20px;
        padding-right: 20px;
		
    }

    .button {
        width: 100%;
        max-width: 420px;  /* 最大幅を520pxに調整 */
        height: auto;
        object-fit: contain;
        cursor: pointer;
    }
	
	.new_cv_button_01, .new_cv_button_02{
        width: 90%;
		height:90%;
	}

	.new_cv_button_01 {
		padding-top:20px;		
	}

	.new_cv_button_02 {
		padding-top:10px;		
	}
		
    .footer {
        text-align: center;
/*        margin-top: 20px;*/
        margin-top: 20px; /* 余白調整 */
	}

    .site-link {
        font-family:"Hiragino W4", sans-serif;
/*        font-size: 14px;*/
        font-size: 12px;
		color: #FFFFFF;
        text-decoration: none;
    }

    .copyright {
        font-family: "Hiragino W4", sans-serif;
        font-size: 12px;
        color: #FFFFFF;
/*        margin-top: 20px;*/
        margin-top: 0px;		
    }
	
	.mobile-only .button-container:first-of-type {
        display: none;
    }
}