@charset "UTF-8";
/**************************************************************/
/* カスタムプロパティ */
/**************************************************************/
:root {
    /* 文字で使われている色 (黒) */
    --txt-color: #333;

    /* 背景で使われている色 (白) */
    --bg-color: #fff;

    --nav-color:#34d8f6;
}

/*フォント*/
.font-ibm-normal{
    /*font-weight: 400;*/
    font-weight: normal;
}

.font-ibm-bold{
    /*font-weight: 400;*/
    font-weight: bold;
}

html {
    background-color: var(--bg-color);
    scroll-behavior: smooth;
}

body {
    font-family: "Noto Sans JP", 'Noto Sans', "Hiragino Sans", sans-serif,Meiryo, メイリオ, "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro";
    text-justify: inter-character;
    -webkit-font-smoothing: antialiased; /* macOS/Safariのフォントを滑らかに */
    -moz-osx-font-smoothing: grayscale; /* Firefox用だが念のため */
    margin:0;
    padding:0;
    color: var(--txt-color);
    line-height: 1.5;
    background-color: var(--bg-color);
    text-align: justify;
    word-wrap: break-word;
    word-break: break-all;
    display: flex;
    flex-direction: column;
    overflow-x: hidden;
}

a {
	color: #333;
    text-decoration: none;
}

a:hover{
	color: #333;
    text-decoration: none;
}

/* スクロールバー */
body::-webkit-scrollbar, textarea::-webkit-scrollbar, .uk-offcanvas-bar-light::-webkit-scrollbar, .uk-modal-body::-webkit-scrollbar, .noedittextarea::-webkit-scrollbar {
	width: 8px;
	height: 10px;
}

body::-webkit-scrollbar-track, textarea::-webkit-scrollbar-track, .uk-offcanvas-bar-light::-webkit-scrollbar-track, .uk-modal-body::-webkit-scrollbar-track, .noedittextarea::-webkit-scrollbar-track {
	background-color: #fff;
}

body::-webkit-scrollbar-thumb, textarea::-webkit-scrollbar-thumb, .uk-offcanvas-bar-light::-webkit-scrollbar-thumb, .uk-modal-body::-webkit-scrollbar-thumb, .noedittextarea::-webkit-scrollbar-thumb {
	background-color: var(--nav-color);
}

.pcnone{
    display: none;
}

.spnone{
    display: none;
}

/**************************************************************/
/* ヘッダー */
/**************************************************************/
header {
    width:100%;
    background:rgba(255, 255, 255, 0.8);
    border-bottom:solid 1px #fff;
    padding:10px 0 20px 0;
    position:fixed;
    top:0;
    z-index:1000;
    transition: top 0.3s ease-out, opacity 0.3s ease-out;
    opacity: 1;
}

header .header-top{
    max-width:1280px;
    width:100%;
    margin:0 auto;
    display:flex;
    flex-flow: row wrap;
    justify-content:space-between;
}

.header-top .logo{
    margin:5px auto 0 0;
    padding-left:10px;
}

.header-top .logo img{
    width:290px;
}

.header-top .topitem {
    font-size:16px;
    color:#555;
    justify-content:center;
    align-items:center;
    padding-right:20px;
}

.header-top .topitem ul{
    display: flex;
    margin:0;
    padding:0;
}

.header-top .topitem li{
   margin-left:30px;
   text-align: center;
   list-style: none !important;
}

.header-top .topitem a{
    display: flex;
    align-items: center;
}

.header-top .topitem a img{
    width: 18px;
    height:18px;
    opacity: 0.7;
    margin-top: 1px;
    margin-right: 2px;
}

.nav-item{
    margin:25px auto 0px;
    width:100%;
    font-size:20px;
    color:#555;
    display: flex;
    justify-content: center;
}

.nav-item .pcmenu{
    display: flex;
    margin:0 auto;
    justify-content: center;
}

.nav-item li{
    list-style: none;
    margin-right: 25px;
    padding-left: 5px;
    white-space:nowrap;
}


.nav-item-img{
    width:100%;
    margin:0;
    vertical-align:middle;
}

.nav-item .pcmenu .vline{
    border-right:solid 2px #555;
}

/*トップメニューマウスオーバーの線*/
.nav-item .pcmenu .textlink {
    position: relative;
    color: #555;
    padding-left: 10px;
    position: relative;
}

.nav-item .pcmenu .textlink::after {
    content: '';
    width: 2px;
    height: 100%;
    background-color: #555;
    position: absolute;
    bottom: 0;
    left: 0;
    transform: scale(1, 0);
    transition: 0.2s;
    transform-origin: left bottom;
}

/* マウスオーバー時 */
.nav-item .pcmenu .textlink:hover::after {
  transform: scale(1, 1);
}

.nav-item .pcmenu .nolink{
    color:#aaa;
}

.submenu {
    display: none;
    position: absolute;
    z-index: 1010;
    background:#fff;
    padding:10px;
    border-top:solid 3px #555;
    left: 0;
    top: 100%;
    width: max-content;
}

.submenu a {
    display: block;
}

.submenu li {
    position: relative;
    font-size:16px;
    margin:10px 0 0 0;
    padding:5px;
    width:100%;
    border-bottom:solid 1px #555;
}

.submenu li:hover {
    background:#eee;
}

.submenu-open {
    z-index: 1020;
    animation:sbmenu-open-anime .2s forwards;
}

.submenu-close {
    z-index: 1019;
    animation:sbmenu-close-anime .2s reverse forwards;
}

@keyframes sbmenu-open-anime {
	0% {opacity: 0;margin-top:-10px}
	100% {opacity: 100;margin-top:0px}
}

@keyframes sbmenu-close-anime {
	0% {opacity: 0;}
	100% {opacity: 100;}
}

@media screen and (min-width: 1020px) {
    .spnone{
        display: block;
    }

    .pcnone{
        display: none;
    }
}

/*画面サイズ1280以下*/
@media screen and (max-width: 1279px) {
    header {
        padding:0.8vw 0 1.4vw 0;
    }

    .header-top .logo{
        margin:0.2vw auto 0 0;
    }

    .header-top .logo img{
        width:22.5vw;
    }

    .header-top .topitem{
        font-size:max(1.2vw,10px);
        margin:0;
        padding-right:20px;
    }

    .header-top .topitem ul li{
        margin-left:2vw;
    }

    .header-top .topitem a img{
        width: 1.5vw;
        height:1.5vw;
        min-width: 10px;
        min-height: 10px;
        margin-top: 0.1vw;
        margin-right: 2px;
    }

    .nav-item {
        margin:2vw auto 0px;
        font-size:1.6vw;
        display: block;
    }

    .nav-item li {
        margin-right: 1.8vw;
        padding-left: 5px;
    }

    .nav-item-img {
        width:13.5vw;
    }

    .nav-item .pcmenu .vline{
        border-right:solid 2px #555;
    }

    .submenu li {
        font-size:1.6vw;
        margin:10px 0 0 0;
        padding:5px 0;
    }
    .spnone{
        display: block;
    }

    .pcnone{
        display: none;
    }
}

/*画面サイズ599以下スマホ用*/
@media screen and (max-width: 599px) {
    header {
        padding:10px 0 0 0;
    }

    .header-top .logo img{
        width:180px;
        margin:0;
    }

    .header-top .topitem{
        font-size:8px;
        margin:0;
        padding-right:10px;
    }

    .header-top .topitem a{
        display: inline;
    }

    .header-top .topitem a img{
        width: 16px;
        height:16px;
        opacity: 0.7;
        margin-top: 0;
        margin-right:0;
        margin-bottom:3px;
    }

    .nav-item {
        margin:13px auto 0px;
    }

    .nav-item-img_spdiv{
        /*background: linear-gradient(90deg, #34d8f6, #20e790 70%, #b4e72b);*/
        background:#fff;
        border-radius: 4px;
        width:110px;
        margin:-4px 0 0 10px;
        text-align: center;
    }

    .nav-item-img_spdiv img {
        width:95px;
        margin:4px;
    }

    .nav-item .spmenu {
        width:95%;
        display: flex;
        margin:5px auto;
        /*justify-content: space-between;*/
        font-size:8px;
        line-height: 1em;
        margin-top:5px;
        padding:0;
    }

    .nav-item .spmenu .textlink ,
    .nav-item .spmenu .nolink{
        display:block;
        text-align: center;
        width:50px;
        margin-right:calc(100% / 6 - 50px);
    }

    .nav-item .spmenu .textlink:last-child {
        width:60px;
        margin-right:0;
    }

    .nav-item .spmenu .nolink{
        opacity: .5;
    }

    .nav-item .spmenu .textlink div ,
    .nav-item .spmenu .nolink div{
        height:16px;
        display: flex;
        justify-content: center;
        align-items: center;
    }

    /*.nav-item li {
        margin: 0;
    }*/

    .spnone{
        display: none;
    }

    .pcnone{
        display: block;
    }
}

@media screen and (max-width: 369px) {
    .header-top .topitem{
        font-size:7px;
    }

    .header-top .logo img{
        width:calc(100dvw - 180px);
        margin:0;
    }

    .nav-item .spmenu{
        font-size:7px;
        margin-top:7px;
    }

    .nav-item .spmenu .textlink ,
    .nav-item .spmenu .nolink{
        width:45px;
        margin-right:calc(100% / 6 - 45px);
    }
}

/*スマホ用メニュー*/
.submenu-overlay {
    position: fixed;
    top: 140;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(255, 255, 255, 0.6); /* 背景を少し暗くする */
    opacity: 0;
    visibility: hidden;
    transition: opacity 0.3s ease, visibility 0.3s ease; /* スムーズなアニメーション */
    z-index: 1020;
}

.submenu-overlay.active {
    opacity: 1;
    visibility: visible;
}

.submenu-content{
    background:#fff;
}
.submenu-content ul{
    font-size: 16px;
}

.submenu-content ul li{
    border-top:solid 1px #555;
    padding:15px 0 15px 20px;
}

.submenu-content ul li:last-child{
    border-bottom:solid 1px #555;
}

.submenu-content a {
    display: block;
}

.submenu-close-div {
    width:100%;
    padding:10px;
    text-align: right;

}

.submenu-close-btn {
    font-size: 14px;
    color:#666;
    border:solid 1px #d8d8d8;
    background:#fff;
    border-radius: 30px;
    padding:1px 30px;
}


/**************************************************************/
/* フッター */
/**************************************************************/
/*
.footer-chara {
    width:100%;
    text-align: center;
    margin:100px 0 0 0;
    background: linear-gradient(#fff 95%, #f0f0f0 96%, #f0f0f0);
}

.footer-chara img {
    max-width:620px;
    width:70%;
    margin:0 auto;
}
*/
footer {
    width:100%;
    margin:0;
    margin:100px 0 0 0;
    padding-top:20px;
    background:#f0f0f0;
}

.companyname{
    width:780px;
    margin:0 auto 30px;
    color:#555;
    font-weight: bold;
    white-space: nowrap;
}

.companyname a{
    font-size:28px;
    color:#555;
    letter-spacing: -0.03em;
}

.companyname span{
    margin-left:20px;
    font-size:18px;
    letter-spacing: -0.02em;
}

.companyflex {
    width:780px;
    margin:0 auto;
    padding:0px;
    display:flex;
    flex-flow: row wrap;
    margin-bottom: 60px;
}

.companyflex-l {
    width:160px;
    margin-right:30px;
}

.companyflex-r {
    width:560px;
}

.companyflex-l div {
    font-size:16px;
    line-height: 2em;
    border-left: solid 1px #ccc;
}

.companyflex-l a {
    margin-left:15px;
    color:#555;
    text-decoration: underline #f0f0f0 0px;
    text-underline-offset: 3px;
    transition: 0.3s;
}

.companyflex-l a:hover {
    text-decoration: underline #555 0px;
}


.businesscontent {
    font-size:16px;
    line-height: 1.4em;
}

.businesscontent-main {
    font-size:16px;
    margin-left:8px;
    border-left: solid 1px #ccc;
}

.businesscontent-main div{
    font-size:14px;
    font-weight:bold;
    margin:0 0 20px 10px;
    white-space:nowrap;
}

.businesscontent-main a {
    font-size:12px;
    margin-left:10px;
    color:#555;
    text-decoration: underline #f0f0f0 0px;
    text-underline-offset: 1px;
    transition: 0.3s;
    line-height:18px;
}

.businesscontent-main a:hover {
    text-decoration: underline #555 0px;
}

.businesscontent-main img {
    width:15px;
    margin:0 0 2px 1px;
}

.businessflex {
    width:590px;
    margin-left:8px;
    display:flex;
    flex-wrap: wrap;
    font-size:12px;
}

.businessflex-main {
    border-left: solid 1px #ccc;
    margin-top:20px;
}

.businessflex-main:nth-child(1),
.businessflex-main:nth-child(3),
.businessflex-main:nth-child(4),
.businessflex-main:nth-child(6){
    width:185px;
}

.businessflex-main:nth-child(2),
.businessflex-main:nth-child(5){
    width:215px;
}

.businessflex-6 {
    height:135px;
}

.businessflex-3 {
    height:110px;
}

.businessflex-2 {
    height:88px;
}

.businessflex-main div {
    font-size:14px;
    font-weight:bold;
    margin:0 0 20px 10px;
    white-space:nowrap;
}

.businessflex-2 div{
    line-height:1.4em;
    margin-bottom:3px;
}

.businessflex-main a {
    font-size:12px;
    margin-left:10px;
    color:#555;
    text-decoration: underline #f0f0f0 0px;
    text-underline-offset: 1px;
    transition: 0.3s;
    line-height: 24px;
}

.businessflex-main a:hover {
    text-decoration: underline #555 1px;
}

.businessflex-main img {
    width:15px;
    margin:0 0 4px 1px;
}

.footernone{
    display: none;
}

.footernone2{
    display: none;
}

@media screen and (max-width: 819px) {
    .footernone{
        display: block;
    }

    .companyname{
        width:620px;
        white-space: normal;

    }

    .companyflex {
        width:620px;
    }

    .companyname span{
        margin-left:0px;
    }

    .companyflex-l {
        width:160px;
    }

    .companyflex-r {
        width:420px;
    }

    .businessflex {
        width:420px;
    }

    .businessflex-main:nth-child(1),
    .businessflex-main:nth-child(3),
    .businessflex-main:nth-child(5) {
        width:215px;
    }

    .businessflex-main:nth-child(2),
    .businessflex-main:nth-child(4),
    .businessflex-main:nth-child(6) {
        width:185px;
    }
}

@media screen and (max-width: 699px) {


    .footernone2{
        display: block;
    }

    .companyname{
        width:500px;
    }

    .companyflex {
        width:500px;
    }

    .companyflex-r {
        width:300px;
    }

    .businessflex {
        width:300px;
    }

    .businessflex-main:nth-child(1),
    .businessflex-main:nth-child(2),
    .businessflex-main:nth-child(3),
    .businessflex-main:nth-child(4),
    .businessflex-main:nth-child(5),
    .businessflex-main:nth-child(6) {
        width:215px;
    }
}

@media screen and (max-width: 599px) {
    footer {
        padding-top:0;
        margin:50px 0 0 0;
    }
    
    /*
    .footer-chara {
        margin:50px 0 0 0;
    }
    */
}

.companyaccordion{
    padding-bottom:60px;
    width:95%;
    margin:0 auto;
    font-size: 14px;
}

/* アコーディオン全体 */
summary {
  display: grid;
  align-items: center;
  padding: 8px 10px;
  border-bottom: 1px solid #ccc;
  font-weight: bold;
  cursor: pointer;
  &::-webkit-details-marker {
    display: none;
  }
}

.accordion {
  border-bottom: 1px solid #ddd;
  overflow: hidden; /* コンテンツがはみ出さないようにする */
}

/* クリックする部分 */
.accordion-trigger {
  display: flex;
  justify-content: space-between; /* テキストとアイコンを両端に配置 */
  align-items: center;
  cursor: pointer;
  padding: 10px;
}

/* ボーダーアニメ */
.accordion-border {
    background:#aaa;
    width:0;
    height:1px;
    transition: width 0.3s ease-in-out;
}

/* 開閉するコンテンツ */
.accordion-content {
  height: 0;
  padding-left:20px;
  overflow: hidden;
  transition: height 0.3s ease-in-out,
    padding 0.3s ease-in-out;
}

.accordion-content a {
    display:block;
    margin-bottom: 10px;
}

.accordion-content img {
    width: 20px;
    margin:0 0 0px 1px;
}

/* アイコンのスタイル */
.accordion-icon {
    /* 以前の+アイコンのテキストを非表示にするか、削除してください */
    display: none;
}

.accordion-trigger::after {
    content: '＋'; /* デフォルトのアイコン */
    font-size: 14px;
    line-height: 1;
    transition: transform 0.3s ease-in-out;
    margin-left: 10px; /* テキストとの間隔 */
    transform: rotate(-180deg);
}

/* 開いた状態のスタイル */
.accordion-trigger.is-open::after {
    content: '―'; /* 開いたときにアイコンを-に変更 */
    transform: rotate(0deg); /* 必要に応じて回転をリセット */
}


/**************************************************************/
/* プライバシーポリシー　コピーライト */
/**************************************************************/
.company-policy {
    width:100%;
    margin:0 auto;
    font-size:16px;
    color:#fff;
    background:#000;
    text-align:center;
    padding:15px 0;
}

.company-policy a {
    color:#fff;
    text-decoration: underline #000 0px;
    text-underline-offset: 2px;
    transition: 0.3s;
}

.company-policy a:hover {
    text-decoration: underline #fff 1px;
}

.company-policy span {
    color:#fff;
    margin:0 10px;
}

.policyinl {
    display:none;
}

.policynone {
    display:inline;
}

.company-copy {
    width:100%;
    margin:0 auto;
    font-size:16px;
    color:#fff;
    background:#000;
    text-align:center;
    padding-bottom:15px;
}

@media screen and (max-width: 899px) {
    .policyinl {
        display:inline;
    }

    .policynone {
        display:none;
    }

    .company-policy span {
        margin:0 8px;
    }
}

@media screen and (max-width: 599px) {
    .company-policy {
        font-size:13px;
    }

    .company-copy {
        font-size:13px;
    }

    .company-policy span {
        margin:0 5px;
    }
}


/**************************************************************/
/* 404 */
/**************************************************************/
.page-notfound-title {
    font-size: 20px;
    margin:60px auto 30px auto;
    width: calc(100% - 40px);
    text-align: center;
}

.page-notfound-text {
    font-size: 16px;
    margin:0 auto 30px auto;
    width: calc(100% - 40px);
    text-align: center;
}

.page-notfound-text a {
    color: #00acca;
}

.page-notfound-text a:hover {
    color: #007286;
    transition: 0.2s;
}

@media screen and (max-width: 599px) {

    .page-notfound-title {
        font-size: 16px;
        margin:30px auto 15px auto;
        width: calc(100% - 20px);
    }

    .page-notfound-text {
        font-size: 14px;
        margin:0 auto 15px auto;
        width: calc(100% - 20px);
    }
}