:root{
    --shadow: #B0B0B0;

    --font-semi-normal: clamp(0.72rem, 0.64rem + 0.24vw, 0.8rem);
    --font-normal:      clamp(0.9rem, 0.8rem + 0.3vw, 1rem);
    --font-semi-large:  clamp(1rem, 0.9rem + 0.5vw, 1.25rem);
    --font-large:       clamp(1.1rem, 1rem + 0.7vw, 1.5rem);
    --font-semi-larger: clamp(1.2rem, 1.1rem + 0.9vw, 1.7rem);
    --font-larger:      clamp(1.4rem, 1.2rem + 1.1vw, 2rem);
    --font-ex-large:    clamp(1.8rem, 1.5rem + 1.6vw, 3rem);

    --deep-blue: #003682;
    --light-blue: #D4E6FF;

    --base-red: #D60F19;
    --light-red: #E84A51;
    --pale-red: #F29A9E;
    --ex-pale-red: #F9DCDD;

    --orange-red: #E65C22;

    --border-color: #bfbfbf;

    --white: #fdfdfd;
    --font-black: #222222;
}

* { 
    margin: 0; 
    padding: 0; 
    box-sizing: border-box;
}

body {
    font-family: 'Noto Sans JP', sans-serif;
    line-height: 1.6;
    color: #333;
    padding-top: 70px;
}

h1, h2, h3, h4, div, p, li, a{
    color: var(--font-black);
}

.sp{
    display: none;
}

a{text-decoration: none;}

section[id] {
    scroll-margin-top: 70px;
}

html {
    scroll-behavior: smooth;
}
  

/* ------------------------- */
/* ---------- 共通 ---------- */
/* ------------------------- */
h2.title{
    font-size: var(--font-ex-large);
    text-align: center;
    padding: 60px 0;
}

h3.section-title{
    font-size: var(--font-larger);
    color: white;
    background-color: var(--base-red);
    padding:10px 0 10px 20px;
    margin-bottom: 30px;
}

#company-info .section-title{
    font-size: var(--font-ex-large);
    text-align: center;
    color: white;
    background-color: var(--base-red);
    padding:15px 0;
    margin-bottom: 60px;
}

.respo{
    display: none;
}

.s-sp{display: none;}

/* ---------------------------------------- */
/* ---------- 各セクション wrapper ---------- */
/* ---------------------------------------- */
#five-strength .strength-wrapper,
#business-content .service-wrapper,
#philosophy .contents-wrapper,
#greeting .greeting-contents-wrapper,
.company-info-wrapper, .footer-wrapper{ 
    width: min(65.6%, 1260px);
    margin: 0 auto;
}

@media (min-width: 1201px) {
    #five-strength .strength-wrapper,
    #business-content .service-wrapper,
    #philosophy .contents-wrapper,
    #greeting .greeting-contents-wrapper,
    .company-info-wrapper{ 
        min-width: 1000px;
    }
}

/* レスポンシブ */
/* =========================
   タブレット（～1200px）
========================= */
@media (max-width: 1200px) {
    #five-strength .strength-wrapper,
    #business-content .service-wrapper,
    #philosophy .contents-wrapper,
    #greeting .greeting-contents-wrapper,
    .company-info-wrapper {
        width: 90%;
    }

    .bg-blue, #greeting{
        padding: 90px 0;
    }
}


/* =========================
   タブレット（～999px）
========================= */
@media (max-width: 999px){
    .respo{
        display: block;
    }
}

/* =========================
スマホ（～768px）
========================= */
  @media (max-width: 768px) {
    .sp{
        display: block;
    }

    .non-sp{
        display: none !important;
    }
  
    body{padding-top: 50px;}    
}
  
@media (max-width: 480px) {
    .s-sp{display: block;}
    .resp.info, .resp-info{display: none;}
    body{padding-top: 75px;}
}