/* フォントサイズと文字間隔のクラス */
        .garamond-font-1 span {
            font-family: "garamond-premier-pro", serif;
            font-size: 65px;
            font-weight: 400;
            font-style: normal;
            color: #28180f;
        }

        .garamond-font-2 span {
            font-family: "garamond-premier-pro", serif;
            font-size: 50px;
            font-weight: 400;
            font-style: normal;
            color: #28180f;
        }

        .ocr-font-1 span {
            font-family: "ocr-b-std", monospace;
            font-size: 56px;
            font-weight: 100;
            font-style: normal;
            color: #28180f;
        }

        .ocr-font-2 span {
            font-family: "ocr-b-std", monospace;
            font-size: 42px;
            font-weight: 400;
            font-style: normal;
            color: #28180f;
        }

        #preview-texts {
            display: flex;
            justify-content: center;
            position: relative;
        }

        #preview1, #preview2 {
            z-index: 10;
            white-space: nowrap;
            position: absolute;
            left: 50%;
            transform: translateX(-50%);
            overflow: hidden;
            text-overflow: clip; /* ここでellipsisの代わりにclipを使う */
        }

        #preview1 {
            max-width: 710px;
        }

        #preview2 {
            max-width: 710px;
        }

        .Upper { position: absolute; top: 1135px; left: 265px; }
        .Lower { position: absolute; top: 1290px; left: 265px; }

        body, html {
            margin: 0;
            padding: 0;
            width: 100%;
            height: 100%;
            overflow: hidden;
        }

        .container-wrapper {
            display: flex;
            justify-content: center;
            align-items: center;
            height: 100vh;
        }

        .fixed-size-container {
            width: 1200px;
            height: 2000px;
            border: 1px solid #000;
            box-sizing: border-box;
            background-image: url('arttag4.png');
            background-size: contain;
            background-position: center;
            background-repeat: no-repeat;
            position: relative;
        }

        .scale-container {
            position: absolute;
            top: 50%;
            left: 50%;
            transform: translate(-50%, -50%);
        }

        .input-fields {
            display: flex;
            flex-wrap: wrap;
            justify-content: center;
            margin-bottom: 20px;
        }

        .input-fields label {
            margin: 5px;
            font-size: 18px;
        }

        .input-fields input {
            padding: 8px;
            margin: 5px;
            font-size: 25px;
            border: 1px solid transparent;
            border-radius: 4px;
            box-sizing: border-box;
            color: #000;
            background-color: transparent;
        }

        #input1, #input2 {
            width: 505px;
        }

        .vertical-text {
            writing-mode: vertical-rl;
            text-orientation: mixed;
            white-space: nowrap;
        }

        .link-area {
            position: absolute;
            left: 882px;
            top: 1880px;
            width: 240px;
            height: 50px;
            background-color: rgba(255, 255, 255, 0);
            z-index: 10;
        }

        .link-area a {
            display: block;
            width: 100%;
            height: 100%;
        }

        .overlay-image {
            position: absolute;
            left: 138px;
            top: 588px;
            width: 925px;
            height: 171px;
            background-size: cover;
            z-index: 5;
        }

        .tap-area {
            position: absolute;
            width: 235px;
            height: 50px;
            z-index: 20;
            background-color: transparent;
        }

        .tap-area-garamond {
            left: 270px;
            top: 1000px;
        }

        .tap-area-ocr {
            left: 550px;
            top: 1000px;
        }

        .orange-line {
            position: absolute;
            width: 180px;
            height: 3px;
            background-color: orange;
            z-index: 15;
            display: block;
            left: 300px;
            top: 1035px;
        }