/*===============================================
●style.css 画面の横幅が737px以上
===============================================*/
@media print, screen and (min-width: 737px){
.wrapper .spec {
	display: table;
	width:744pxpx;
	margin: 0 auto 50px;
	font-family: "Times New Roman", "游明朝", "Yu Mincho", "游明朝体", "YuMincho", "ヒラギノ明朝 Pro W3", "Hiragino Mincho Pro", "HiraMinProN-W3", "HGS明朝E", "ＭＳ Ｐ明朝", "MS PMincho", serif;
}
.wrapper .spec:last-of-type {		border-bottom: solid 1px #CCC;}
.wrapper .spec h4 {
	color: #393939;
	font-weight: bold;
	font-size: 16px;
	margin-bottom: 15px;
	margin-top: 20px;
}
.wrapper .spec:first-of-type h4 {
	margin-top: 50px;
}
.wrapper .spec p {
	margin-bottom: 24px;
	color: #3A3A3A;
	font-size: 14px;
	line-height: 21px;
}

.wrapper .img {
	display: table-cell;
	width:438px;
	text-align: center;
	vertical-align: top;
}

}
        /* レイアウトコンテナ */
        .main_container {
            font-family: 'Noto Sans JP', "Helvetica Neue", Arial, sans-serif;
            line-height: 1.8;
            -webkit-font-smoothing: antialiased;
            margin: 0 auto;
            text-align: center;
        }

        /* 各セクションのブロック */
        .philosophy-section {
            margin-bottom: 60px; /* セクション間の余白を広めにとって今風に */
        }
        .philosophy-section:last-child {
            margin-bottom: 60px;
        }

        /* 英語+日本語のラベル（画像の雰囲気を再現） */
        .label {
            display: inline-block;
            color: #009cb4; /* 画像から抽出したティール色 */
            border: 1px solid #009cb4;
            background-color: #fff;
            padding: 6px 30px;
            border-radius: 50px; /* 丸みのあるピル型 */
            font-weight: 700;
            font-size: 0.95rem;
            letter-spacing: 0.05em;
            margin-bottom: 24px;
            box-shadow: 0 2px 5px rgba(0, 156, 180, 0.1); /* ほんのり影をつけて浮き出し感を出す */
        }

        .label span {
            font-size: 0.85rem;
            margin-left: 5px;
            font-weight: 500;
        }

        /* メインの見出し */
        .main-heading {
            font-size: 1.8rem!important;
            font-weight: 700;
            letter-spacing: 0.1em;
            color: #1a1a1a;
            text-align-last: center;
        }

        /* サブの見出し（英語部分など） */
        .sub-heading {
            display: block;
            font-size: 5.2rem;
            font-weight: 700;
            margin-bottom: 16px;
            color: #1a1a1a;
            text-align-last: center;
        }

        /* 本文テキスト */
        .description {
            font-size: 1rem;
            color: #555555;
            max-width: 600px;
            margin: 0 auto;
            text-align: justify; /* 両端揃えで整える */
            text-align-last: center; /* 最後の行は中央寄せ */
        }

/*===============================================
●smart.css  画面の横幅が736pxまで
===============================================*/
@media only screen and (max-width:736px){
.wrapper .spec { 
width: 90%;
margin: 5% auto;
}
.wrapper .spec h4 {
	color: #393939;
	font-weight: bold;
	font-size: 1.1em;
	margin-bottom: 3%;
	text-align: left;
}
.wrapper .spec p {
	margin-bottom: 15px;
	color: #3A3A3A;
	text-align: left;
}
.wrapper .spec .img{
	width: 100%;
	margin: 3% auto 5%;
	border:1px solid #ddd;
}
.wrapper .spec:first-of-type .img img {
	width: 100%;
	max-width: 200px;
}
.wrapper .spec:last-of-type .img img {
	width: 100%;
	max-width: 300px;
}
            .main_container {
                padding: 60px 20px;
            }
            .philosophy-section {
                margin-bottom: 80px;
            }
            .main-heading {
                font-size: 1.6rem;
            }
            .sub-heading {
                font-size: 1.2rem;
            }
            .description {
                text-align: left; /* スマホでは左寄せの方が読みやすい場合が多い */
                text-align-last: left;
            }
}