@font-face {
    font-family: 'Noto Sans JP';
    font-style: normal;
    font-weight: 500;
    src: local("Noto Sans CJK JP"),
        url(//fonts.gstatic.com/ea/notosansjp/v5/NotoSansJP-Medium.woff2) format('woff2'),
        url(//fonts.gstatic.com/ea/notosansjp/v5/NotoSansJP-Medium.woff) format('woff'),
        url(//fonts.gstatic.com/ea/notosansjp/v5/NotoSansJP-Medium.otf) format('opentype');
}

@font-face {
    font-family: 'Noto Sans JP';
    font-style: bold;
    font-weight: 700;
    src: local("Noto Sans CJK JP"),
        url(//fonts.gstatic.com/ea/notosansjp/v5/NotoSansJP-Bold.woff2) format('woff2'),
        url(//fonts.gstatic.com/ea/notosansjp/v5/NotoSansJP-Bold.woff) format('woff'),
        url(//fonts.gstatic.com/ea/notosansjp/v5/NotoSansJP-Bold.otf) format('opentype');
}


.cmsbody .loading {
    content: '';

    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    position: fixed;
    z-index: 1000;
    transition: 0.4s opacity;


    display: flex;
    justify-content: start;
    align-items: center;

    background: linear-gradient(180deg,
            rgba(255, 255, 255, 1) 50%,
            rgba(255, 255, 255, 0) 50%,
            rgba(255, 255, 255, 0) 60%,
            rgba(255, 255, 255, 1) 60%,
            rgba(255, 255, 255, 1) 65%,
            rgba(255, 255, 255, 1) 80%,
            rgba(255, 255, 255, 0) 80%,
            rgba(255, 255, 255, 0) 90%,
            rgba(255, 255, 255, 1) 90%,
            rgba(255, 255, 255, 1) 100%);
    background-size: 100% 200%;
    background-position: center top;
    background-repeat: no-repeat
}



.cmsbody .loading .loader {
    background-color: #222;
    width: 100%;
    height: 1px;
    transform: scaleX(0);
    transform-origin: center left;
    animation: loadingBar 2s forwards;
}

@keyframes loadingBar {
    0% {
        transform: scaleX(0);
        transform-origin: center left;
        animation-timing-function: cubic-bezier(0.25, 1, 0.5, 1);
    }

    50% {
        transform-origin: center left;
        transform: scaleX(100%);
    }

    50.01% {
        transform: scaleX(100%);
        transform-origin: center right;
        animation-timing-function: cubic-bezier(0.5, 0, 0.75, 0);
    }

    100% {
        transform-origin: center right;
        transform: scaleX(0);
    }
}



.cmsbody .loading {
    animation: loadingBg 2s 2s forwards;
    pointer-events: none;
}

@keyframes loadingBg {
    0% {
        background-size: 100% 200%;
    }

    50% {
        background-size: 100% 0;
    }

    100% {
        background-size: 100% 0;
        opacity: 0;
    }
}

/* body.cmsbody {
    overflow: hidden;
}

body.cmsbody.loaded {
    overflow: auto;
} */


#editView .cmshtml .loading {
    display: none;
}

.cmshtml {
    font-size: 16px;
}

.cmshtml .cmsbody {
    font-size: 1rem;
    color: #222;
    font-family: "Noto Sans CJK JP", "Hiragino Kaku Gothic ProN",
        "Helvetica Neue", Arial, "Hiragino Sans",
        Meiryo,
        sans-serif;
    font-weight: 500;
    line-height: 1.5;
}

.cmshtml a:link,
.cmshtml a:visited {
    text-decoration: none;
    color: #222;
    transition: 0.2s color;
}

.cmshtml a:hover {
    text-decoration: underline;
    color: #888;
}

.cmshtml :not(.scrolled) .globalHeader .rdNavigation a:link,
.cmshtml :not(.scrolled) .globalHeader .rdNavigation a:visited {
    text-decoration: none;
    /* color: #fff; */
}

.cmshtml .globalHeader .rdNavigation a:hover {
    text-decoration: none;
    /* color: #fff; */
}

.cmshtml .globalHeader .rdNavigation:not(.rdNavigation-mega01) .rdNavigationLi .rdNavigationLi a:link,
.cmshtml .globalHeader .rdNavigation:not(.rdNavigation-mega01) .rdNavigationLi .rdNavigationLi a:visited,
.cmshtml .globalHeader .rdNavigation:not(.rdNavigation-mega01) .rdNavigationLi .rdNavigationLi a:hover {
    text-decoration: none;
    /* color: #222; */
}

.cmshtml .globalHeader .rdNavigation>.rdNavigationInner>.rdNavigationUl>.rdNavigationLi:has(>.rdNavigation)>.rdNavigationItem.rdNavigationItem:after {
    transition: none !important
}

.cmshtml :not(.scrolled) .globalHeader .rdNavigation>.rdNavigationInner>.rdNavigationUl>.rdNavigationLi:has(>.rdNavigation)>.rdNavigationItem.rdNavigationItem:after {
    /* border-right: 2px solid #fff;
    border-bottom: 2px solid #fff; */
}

.cmshtml .rdNavigation-horizontal02.rdNavigation-horizontal02.rdNavigation-horizontal02,
.cmshtml .rdNavigation-horizontal01.rdNavigation-horizontal01.rdNavigation-horizontal01 {
    /* background: none; */
}


.cmshtml .scrolled .globalHeader .rdNavigation-horizontal03.rdNavigation-horizontal03 a:link,
.cmshtml .scrolled .globalHeader .rdNavigation-horizontal03.rdNavigation-horizontal03 a:visited {
    color: #222;
}

.cmshtml .scrolled .rdNavigation-horizontal03.rdNavigation-horizontal03>.rdNavigationInner>.rdNavigationUl>.rdNavigationLi:has(>.rdNavigation)>.rdNavigationItem:after {
    border-right-color: #222;
    border-bottom-color: #222;
}

.cmshtml .scrolled .rdNavigation-horizontal03.rdNavigation-horizontal03>.rdNavigationInner>.rdNavigationUl>.rdNavigationLi:has(>.rdNavigation)>.rdNavigationItem:hover:after {
    border-right-color: #fff;
    border-bottom-color: #fff;

}


@media screen and (max-width: 576px) {

    .cmshtml .rdNavigation-horizontal02.rdNavigation-horizontal02.rdNavigation-horizontal02,
    .cmshtml .rdNavigation-horizontal01.rdNavigation-horizontal01.rdNavigation-horizontal01 {
        /* background: #fff; */
    }

    .cmshtml .globalHeader .rdNavigation>.rdNavigationInner>.rdNavigationUl>.rdNavigationLi:has(>.rdNavigation)>.rdNavigationItem.rdNavigationItem:after {
        /* border-right: 2px solid #222;
        border-bottom: 2px solid #222; */
    }


    .cmshtml .globalHeader .rdNavigation a:link,
    .cmshtml .globalHeader .rdNavigation a:visited {
        /* text-decoration: underline;
        color: #222; */
    }

    .cmshtml .globalHeader .rdNavigation a:hover {
        /* text-decoration: none;
        color: #fff; */
    }

    .rdNavigation-mega01 .rdNavigationLi>.rdNavigation .rdNavigationLink.rdNavigationLink.rdNavigationLink {
        /* color: #fff; */
    }

}


.cmshtml .globalFooter a:link,
.cmshtml .globalFooter a:visited {
    text-decoration: none;
    color: #fff;
}

.cmshtml .globalFooter a:hover {
    text-decoration: none;
    color: #ccc;
}


.cmshtml input[type="submit"]:not(.btn, .rdBlogSearch-btn),
.cmshtml input[type="button"]:not(.btn, .rdBlogSearch-btn),
.cmshtml button:not(.btn) {
    background-image: linear-gradient(to top, #F44336 0%, #ff995a 51%, #F44337 100%);
    padding: 10px 20px;
    text-align: center;
    transition: 0.3s;
    background-size: auto 200%;
    color: white;
    box-shadow: 0 0 20px #eee;
    border-radius: 4px;
    border: 1px solid #b75321;
}

.cmshtml input[type="submit"]:not(.btn):hover,
.cmshtml input[type="button"]:not(.btn):hover,
.cmshtml button:not(.btn):hover {
    background-image: linear-gradient(to top, #F44336 0%, #ff995a 51%, #F44337 100%);
    background-position: bottom center;
    background-size: auto 100%;
    color: #fff;
    text-decoration: none;
    box-shadow: 0 0 6px #FFC107;
}



.cmshtml .main {
    max-width: 1400px;
    margin: auto;
}

/* 見出し類 */
.cmshtml h1 {
    right: 10px;
    top: 0;
    z-index: 90;
    font-size: 0.75rem;
    font-weight: 500;
    text-align: right;
}

.scrolled .cmshtml h1 {
    color: #222;
}

@media screen and (max-width:576px) {
    .cmshtml h1 {
        display: none;
    }
}

.cmshtml.cmshtml .cmsbody h2 {
    font-size: 1.5rem;
    font-weight: 700;
}

.cmshtml.cmshtml .cmsbody h3 {
    font-size: 1.4rem;
    font-weight: 700;

}

.cmshtml.cmshtml .cmsbody h4 {
    font-size: 1.3rem;
    font-weight: 700;

}

.cmshtml.cmshtml .cmsbody h5 {
    font-size: 1.2rem;
    font-weight: 700;
}

.cmshtml.cmshtml .cmsbody h6 {
    font-size: 1rem;
    font-weight: 700;
}

@media screen and (max-width:576px) {

    .cmshtml.cmshtml .cmsbody h2 {
        font-size: 1.2rem;
        font-weight: 700;
    }

    .cmshtml.cmshtml .cmsbody h3 {
        font-size: 1.2rem;
        font-weight: 700;

    }

    .cmshtml.cmshtml .cmsbody h4 {
        font-size: 1.2rem;
        font-weight: 700;

    }

    .cmshtml.cmshtml .cmsbody h5 {
        font-size: 1rem;
        font-weight: 700;
    }


}



/* layout */


.cmshtml .keyVisual {
    position: relative;
    z-index: 50;
}

.cmshtml .pageTitle {
    position: relative;
    z-index: 50;
}


@media screen and (max-width:576px) {
    /* .cmshtml .keyVisual {
        height: 50vh;
    }

    .cmshtml .keyVisual div {
        max-height: 50vh;
    }
*/
}


.cmshtml .main .inner {
    margin: auto;
}


.cmshtml .globalHeader {
    transition: 0.3s background;
    left: 0;
    top: 0;
    width: 100%;
    z-index: 200;
	position: relative;
    background: #fff;
}







.cmshtml span[style*="color"] a,
.cmshtml a:has(span[style*="color"]) {
    text-decoration: none;
}

/* overwrite force */
.cmshtml .cmsbody .rdslide .rdsp-buttons {
    margin-top: -50px;

}

.cmshtml .rdNavigation .rdNavigationUl {
    justify-content: end;
}

.cmshtml .rdNavigation .rdNavigation .rdNavigationUl {
    justify-content: start;
}

.cmshtml .cmsbody .rdtableTable {
    border: none;
}

/* editView Fix */
.showhideElement .cmshtml .globalHeader {
    position: relative !important;
}

/* blog */
.cmshtml .blogflame {
    max-width: 1200px;
    margin: auto;
    padding: 40px 0;

}

.cmshtml .blogmain {
    max-width: 1000px;
    margin: auto;
}


.cmshtml .rdarticleTitle.rdarticleTitle h3 {
    border: none;
    font-size: 1.6rem;
}

.cmshtml .rdListShort.rdListShort .rdListItem h3.rdarticleTitleText {
    border: none;
    font-size: 1.25rem;
}


.cmshtml .rdListShort .rdListItem.rdListItem {
    width: calc(33.333% - 20px);
}

.cmshtml .rdListShort .rdListItem .rdListTitle.rdListTitle,
.cmshtml .rdListShort .rdListItem .rdListExcerpt.rdListExcerpt {
    padding-right: 20px;
    padding-left: 20px;
}

@media screen and (max-width:576px) {
    .cmshtml .blogflame {
        width: auto;
    }

    .cmshtml .rdListShort .rdListItem.rdListItem {
        width: calc(100% - 20px);
    }

}


.cmshtml .rdCategorylist .rdCategorylist-link.rdCategorylist-link:after {
    border-color: transparent transparent transparent #222;
}

.cmshtml .rdYearlyArchive-item .rdYearlyArchive-link.rdYearlyArchive-link {
    background: #c5c5c5;
}

.cmshtml .rdMonthlyArchive .rdMonthlyArchive-item.rdMonthlyArchive-item:before {
    border: 2px solid #4957c1;
}

.cmshtml .rdCategorylist .rdCategorylist-link.rdCategorylist-link:hover {
    background: #f5f5f5;
    color: #3c3c3c;
}


/* クラスプリセット用 */
.textDarkShadow {
    text-shadow: 0 0 10px rgba(0, 0, 0, 1);
}

.scrolled .globalHeader .textDarkShadow,
.textDarkShadow .rdNavigation .rdNavigation {
    text-shadow: none;
}

@media screen and (max-width:576px) {
    .globalHeader .textDarkShadow {
        text-shadow: none;

    }

    .cmshtml :not(.scrolled) .globalHeader .rdNavigation a:link,
    .cmshtml :not(.scrolled) .globalHeader .rdNavigation a:visited {

        
    }

    .cmshtml :not(.scrolled) .globalHeader .rdNavigation>.rdNavigationInner>.rdNavigationUl>.rdNavigationLi:has(>.rdNavigation)>.rdNavigationItem.rdNavigationItem:after {
        border-right: 2px solid #222;
        border-bottom: 2px solid #222;

    }

    .cmshtml.cmshtml .rdNavigation>.rdNavigationInner>.rdNavigationUl>.rdNavigationLi:has(>.rdNavigation)>.rdNavigationItem:has(>.rdNavigationLink:hover):after {
        border-right-color: #fff;
        border-bottom-color: #fff;
    }
}


.textLightShadow {
    text-shadow: 0 0 10px rgba(255, 255, 255, 1), 0 0 10px rgba(255, 255, 255, 1), 0 0 10px rgba(255, 255, 255, 1), 0 0 10px rgba(255, 255, 255, 1);
}

.textLightShadow .rdNavigation .rdNavigation {
    text-shadow: none;
}

.h70vh {
    height: 700px;
}

@media screen and (max-width:576px) {

    .logo.logo.logo.logo>div {
        width: 200px !important;
        margin-right: auto;
    }
}





/**/
.cmshtml .newinfoHorizontal .rdNewInfoList_ez.rdNewInfoList_ez {
border: none;

}
.cmshtml .newinfoHorizontal .rdNewInfoList_ez.rdNewInfoList_ez .rdNewInfoList_ez-item {
  display: flex;
  gap: 30px;
}
.cmshtml .newinfoHorizontal .rdNewInfoList_ez.rdNewInfoList_ez .rdNewInfoList_ez-item {

  @media (min-width: 1px) and (max-width: 576px) {
      flex-direction: column;
      gap: 0;
  }
}


.cmshtml .newinfoHorizontal .rdNewInfoList_ez.rdNewInfoList_ez .rdNewInfoList_ez-item  {
  border-bottom: 1px solid #ddd;
  border-top: none;
  padding: 15px 0;
}


.cmshtml .equalHeight > .rdblock > .rdflexareaChild,
#editView .cmshtml .equalHeight>[data-type="area"] > .rdareaContents,
#editView .cmshtml .equalHeight>[data-type="area"] >  .rdareaContents .rdflexareaChild,
#editView .cmshtml .equalHeight>[data-type="area"]  > .rdareaContents .rdflexareaChild > .rdareaItem{
  height: 100%;
}




.cmshtml .h700vhsp350.h700vhsp350.h700vhsp350 {
  height: 700px;
  @media (min-width: 1px) and (max-width: 576px) {
      height: 350px;
      background-size: auto 350px;
      background-position: top center;
      background-repeat: repeat;

  }
}


.cmshtml .p50tbsp.p50tbsp.p50tbsp {
  @media (min-width: 1px) and (max-width: 576px) {
      padding-top: 50px;
      padding-bottom: 50px;
  }
}





.cmshtml .h100vhsp50.h100vhsp50.h100vhsp50 {
  height: 100vh;
  @media (min-width: 1px) and (max-width: 576px) {
      height: 50vh;

      background-size: auto 50vh;
      background-position: top center;
      background-repeat: repeat;
  }
}







#editView .pageTitle .rdareaContents:has(>.rdflexareaChild  > .rdareaItem >  .rdareaContents > .positionTop),
#editView .keyVisual .rdareaItem:has( > .rdareaContents > .positionTop),
.cmshtml .positionTop {
	position: absolute;
	width: 100%;
	left: 0;
	top: 0;
}
#editView .pageTitle .rdareaContents:has(>.rdflexareaChild  > .rdareaItem >  .rdareaContents > .positionMiddle),
#editView .keyVisual .rdareaItem:has( > .rdareaContents > .positionMiddle),
.cmshtml .positionMiddle {
	position: absolute;
	width: 100%;
	left: 0;
	top: 50%;
	transform: translateY(-50%)
}

#editView .keyVisual .rdareaItem:has( > .rdareaContents > .positionMiddle),
#editView .pageTitle .rdareaContents:has(>.rdflexareaChild  > .rdareaItem >  .rdareaContents > .positionMiddle) {
	transform: translateY(-50%) !important;
}

#editView .pageTitle .rdareaContents:has(>.rdflexareaChild  > .rdareaItem >  .rdareaContents > .positionBottom),
#editView .keyVisual .rdareaItem:has( > .rdareaContents > .positionBottom),
.cmshtml .positionBottom {
	position: absolute;
	width: 100%;
	left: 0;
	bottom: 0;
}








#editView .positionBottom,
#editView .positionMiddle,
#editView .positionTop {
	position: static;
	transform: none;
}
#editView .positionMiddle {
	transform: none !important;
}

.cmshtml .pageTitle .positionBottom,
.cmshtml .pageTitle .positionMiddle,
.cmshtml .pageTitle .positionTop,

.cmshtml .keyVisual .positionBottom,
.cmshtml .keyVisual .positionMiddle,
.cmshtml .keyVisual .positionTop {
	opacity: 0;
	transform: translateY(50px);
	transition: 1.2s opacity 2s,1.2s transform 2s;


}






#editView .cmshtml .pageTitle .positionBottom,
#editView .cmshtml .pageTitle .positionMiddle,
#editView .cmshtml .pageTitle .positionTop,
.cmshtml .loaded .pageTitle .positionBottom,
.cmshtml .loaded .pageTitle .positionMiddle,
.cmshtml .loaded .pageTitle .positionTop,

#editView .cmshtml .keyVisual .positionBottom,
#editView .cmshtml .keyVisual .positionMiddle,
#editView .cmshtml .keyVisual .positionTop,
.cmshtml .loaded .keyVisual .positionBottom,
.cmshtml .loaded .keyVisual .positionMiddle,
.cmshtml .loaded .keyVisual .positionTop {
	opacity: 1;
	transform: none;
}


#editView .cmshtml .pageTitle .positionMiddle,
.cmshtml .loaded .pageTitle .positionMiddle,

#editView .cmshtml .keyVisual .positionMiddle,
.cmshtml .loaded .keyVisual .positionMiddle {
	transform: translateY(-50%)
}








.cmshtml .mainCmn {

    max-width: 1400px;
    margin: auto;

    display: grid;
grid-template-columns: 300px 1fr;
    grid-template-rows: repeat(3, auto);

  @media (min-width: 1px) and (max-width: 576px) {
      grid-template-columns: 1fr;
      
    grid-template-rows: 1fr;
  }
}



.innerBottom { grid-area: 3 / 1 / 4 / 3; }
.innerSub { grid-area: 2 / 1 / 3 / 2; }
.innerMain { grid-area: 2 / 2 / 3 / 3; }
.innerTop { grid-area: 1 / 1 / 2 / 3; }




.cmshtml .textWhite {
color: #fff;
}
.cmshtml .textWhite a {
color: #fff;
}



@media screen and (max-width: 576px) {
.cmshtml .reverseArea {
flex-direction:column-reverse
}
}


.cmshtml .globalHeader,
.cmshtml .globalHeader .inner {
background: #fff;
transition: background 0.3s
}
.cmshtml .scrolled .globalHeader,
.cmshtml .scrolled .globalHeader .inner {
background: #f6f8f9;
}
.cmshtml .globalHeader .inner.is_stuck {
z-index: 100;
}


.innerSub {
    position: relative;
    z-index: 100;
    overflow: visible !important;
}



@media screen and (max-width: 576px) {
.innerSub {
    position: relative;
    z-index: 300;
    overflow: visible !important;
}
}