<html><head><meta name="color-scheme" content="light dark"></head><body><pre style="word-wrap: break-word; white-space: pre-wrap;">/*====================================================================================================

ã€€CSSæ§‹æˆ

ã€€//çµ¶å¯¾ã«å¤‰æ›´ã—ãªã„CSS
ã€€- reset.css           å…¨ã¦ã®ãƒ–ãƒ©ã‚¦ã‚¶å›ºæœ‰CSSã‚’ãƒªã‚»ãƒƒãƒˆã™ã‚‹CSSã€‚åŸºæœ¬è§¦ã‚‰ãªã„ã“ã¨ã€‚
ã€€- bootstrap.min.css   Bootstrapã‚³ãƒ³ãƒãƒ¼ãƒãƒ³ãƒˆã‚’åˆ©ç”¨ã™ã‚‹ãŸã‚ã®CSSã€‚åŸºæœ¬è§¦ã‚‰ãªã„ã“ã¨ã€‚
ã€€- all.min.css         Font Awesome ã‚’åˆ©ç”¨ã™ã‚‹ãŸã‚ã®CSSã€‚åŸºæœ¬è§¦ã‚‰ãªã„ã“ã¨ã€‚
ã€€- aos.css             AOSã‚’åˆ©ç”¨ã™ã‚‹ãŸã‚ã®CSSã€‚åŸºæœ¬è§¦ã‚‰ãªã„ã“ã¨ã€‚

ã€€//åŸºæœ¬çš„ã«ã¯å¤‰æ›´ã—ãªã„CSS
ã€€- base.css            åŸºæœ¬ã®æ–‡å­—è¨­å®šã‚„ã€Webãƒ•ã‚©ãƒ³ãƒˆã®èª­ã¿è¾¼ã¿ãªã©ã€‚åŸºæœ¬è§¦ã‚‰ãªãã¦ã‚‚OKã€‚

ã€€//ãƒ¡ã‚¤ãƒ³ã§åˆ©ç”¨ã—ã¦ã„ã‚‹CSS
ã€€- common.css          ãƒ˜ãƒƒãƒ€ãƒ¼ã€ãƒ•ãƒƒã‚¿ãƒ¼ã€ä¸‹å±¤ãƒšãƒ¼ã‚¸ã®ã‚¿ã‚¤ãƒˆãƒ«ãªã©ã€å…±é€šãƒšãƒ¼ã‚¸ãƒ¬ã‚¤ã‚¢ã‚¦ãƒˆã‚’è¨˜è¼‰ã—ãŸCSS
ã€€- stlye.css          å„ãƒšãƒ¼ã‚¸å›ºæœ‰ã®ãƒ¬ã‚¤ã‚¢ã‚¦ãƒˆã‚’è¨˜è¼‰ã—ãŸCSS

ã€€//è£œåŠ©çš„ã«åˆ©ç”¨ã—ã¦ã„ã‚‹CSS
ã€€- module.css          è¦‹å‡ºã—ã‚„ãƒªã‚¹ãƒˆã€ãƒ†ãƒ¼ãƒ–ãƒ«ãªã©ã€å…±é€šåˆ©ç”¨ã§ãã‚‹ãƒ‘ãƒ¼ãƒ„ã‚’ã¾ã¨ã‚ãŸCSS
ã€€- utility.css         ãƒžãƒ¼ã‚¸ãƒ³ã‚„ãƒ‘ãƒ‡ã‚£ãƒ³ã‚°ã€æ–‡å­—ã‚µã‚¤ã‚ºã‚„æ–‡å­—è‰²ãªã©ã€è£œåŠ©çš„ã«åˆ©ç”¨ã§ãã‚‹CSS

====================================================================================================*/


/*------------------------------------------------------------------
  fonts
------------------------------------------------------------------*/
@font-face {
    font-family: "NotoSerifJP";
    src: url("../webfonts/NotoSerifJP-Regular.woff2") format("woff2"),
         url("../webfonts/NotoSerifJP-Regular.woff") format("woff");
    font-weight: 400;
    font-display: swap;
}
@font-face {
    font-family: "NotoSerifJP";
    src: url("../webfonts/NotoSerifJP-Medium.woff2") format("woff2"),
         url("../webfonts/NotoSerifJP-Medium.woff") format("woff");
    font-weight: 700;
    font-display: swap;
}
@font-face {
    font-family: "Lora";
    src: url("../webfonts/Lora-Regular.woff2") format("woff2"),
         url("../webfonts/Lora-Regular.woff") format("woff");
    font-weight: 400;
    font-display: swap;
}
@font-face {
    font-family: "Lora";
    src: url("../webfonts/Lora-Bold.woff2") format("woff2"),
         url("../webfonts/Lora-Bold.woff") format("woff");
    font-weight: 700;
    font-display: swap;
}

/*------------------------------------------------------------------
  base
------------------------------------------------------------------*/
html{
    font-family: "NotoSerifJP", "Hiragino Sans", "Hiragino Kaku Gothic ProN", Meiryo, sans-serif;
    color: #555;
    background: #f5f5f5;
    line-height: 2;
}
*{    
    --letter-spacing: 0.05em;
    letter-spacing: var(--letter-spacing);
}

@media screen and (max-width:991px){
    body{
        font-size: 0.875rem;
    }
}
@media screen and (max-width:350px){
    body {
        font-size: 0.8125rem;
    }
}

hr{
    border-top: 1px solid #ccc;
    border-right: none;
    border-bottom: none;
    border-left: none;
}

/* input-style ----------------------------------------*/
input[type="text"],
input[type="password"],
input[type="tel"],
input[type="email"],
select,
textarea {
    padding: 8px;
    border: 1px solid #ddd;
    background: #fff;
    border-radius: 3px;
    font-size: min(1rem, 16px);
}
select{
    padding: 8px 25px 8px 10px;
}
input[type="text"]:focus,
input[type="password"]:focus,
input[type="tel"]:focus,
input[type="email"]:focus,
select:focus,
textarea:focus {
    border: 1px solid #fff;
    box-shadow: 0 0 5px 0 #9cb4f8;
}
label:hover,
select:hover {
    cursor: pointer;
}
.inputfile_box {
    margin-bottom: 15px;
}
::-webkit-input-placeholder {
    color: #aaa;
    opacity: 1;
}
:-moz-placeholder {
    color: #aaa;
}
::-moz-placeholder {
    color: #aaaaaa;
    opacity: 1;
}
:-ms-input-placeholder {
    color: #aaa;
}

/*------------------------------------------------------------------
  Custom Bootstrap
------------------------------------------------------------------*/
.container,
.container-sm,
.container-md,
.container-lg,
.container-xl,
.container-fluid{
    padding-left: 6vw;
    padding-right: 6vw;
}
@media (min-width: 576px) {
    .container,
    .container-sm,
    .container-md,
    .container-lg,
    .container-xl,
    .container-fluid{
        padding-left: 60px;
        padding-right: 60px;
    }
    .container,.container-sm {
        max-width: 630px;
    }
}
@media screen and (min-width:768px){
    
    .container,.container-sm,.container-md{
        max-width: 810px;
    }
}
@media screen and (min-width:992px){
    .container,.container-sm,.container-md,.container-lg{
        max-width: 1050px;
    }
}
@media screen and (min-width:1200px){
    .container,.container-sm,.container-md,.container-lg,.container-xl{
        max-width: 1230px;
    }
}
@media print{
    .container,.container-sm,.container-md,.container-lg,.container-xl,.container-fluid{
        padding: 0 30px;
    }
}</pre></body></html>