@charset "UTF-8";



/*--------------------------------------------------------



Reset



--------------------------------------------------------*/



*, *::before, *::after {



	box-sizing: border-box;



}







html {



	font-size: 62.5%;



}







body {



	font-size: 1.6rem; /*16px*/



	line-height: 1.5;



	font-family: "Noto Sans JP", "游ゴシック Medium", "游ゴシック体", "Yu Gothic Medium", YuGothic, "ヒラギノ角ゴ ProN", "Hiragino Kaku Gothic ProN", "メイリオ", Meiryo, "ＭＳ Ｐゴシ\ック", "MS PGothic", sans-serif;



	text-align: justify;



	text-justify: inter-ideograph;



	font-feature-settings: "palt" 1;





	text-rendering: optimizeSpeed;



}







main {



  overflow: hidden;



}







body, h1, h2, h3, h4, h5 , p, figure, blockquote, ul, ol, dl, dd {



    margin: 0;



}







ul, ol {



	list-style: none;



	padding-left: 0;



}







h1, h2, h3, h4, h5 {



	font-size: 100%;



}







a:not([class]) {



	-webkit-text-decoration-skip: ink;



	text-decoration-skip-ink: auto;



}







input, button, textarea, select {



    font: inherit;



}







li {



	list-style: none;



	margin: 0;



	padding: 0;



}







a {



	text-decoration: none;



	color: #333;



}







a:hover {



	text-decoration: none;



}







a img {



	border-style: none;



}







img {



    vertical-align: bottom; /* 一番上の画像だけ注意。隙間が空く可能性あり */



    line-height: 0 !important;



}







button {



    background-color: transparent;



    border: none;



    -webkit-backface-visibility: hidden;



    backface-visibility: hidden;



}







button:focus {



    outline: none;



}







button:hover {



    cursor: pointer;



}







input:focus, select:focus {



    outline: none;



}







/*--------------------------------------------------------



定数（基本的に、全サイト共通に使えるもの）



--------------------------------------------------------*/



.c {



    text-align: center !important;



}







.cm {



    margin-left: auto;



    margin-right: auto;



}







.r {



    text-align: right !important;



}







.l {



    text-align: left !important;



}







.inline-block {



    display: inline-block;



}







.block {



    display: block;



}







.vertical-top {



    vertical-align: top;



}







.vertical-middle {



    vertical-align: middle;



}







.pointer {



    cursor: pointer;



}







.br::before {



    content: "\a";



    white-space: pre;



}







.margin_t100 {



    margin-top: 100px;



}







.margin_t90 {



    margin-top: 90px;



}







.margin_t80 {



    margin-top: 80px;



}







.margin_t70 {



    margin-top: 70px;



}







.margin_t60 {



    margin-top: 60px;



}







.margin_t50 {



    margin-top: 50px;



}







.margin_t40 {



    margin-top: 40px;



}







.margin_t30 {



    margin-top: 30px;



}







.margin_t20 {



    margin-top: 20px;



}







.margin_t10 {



    margin-top: 10px;



}







.margin_b100 {



    margin-bottom: 100px;



}







.margin_b90 {



    margin-bottom: 90px;



}







.margin_b80 {



    margin-bottom: 80px;



}







.margin_b70 {



    margin-bottom: 70px;



}







.margin_b60 {



    margin-bottom: 60px;



}







.margin_b50 {



    margin-bottom: 50px;



}







.margin_b40 {



    margin-bottom: 40px;



}







.margin_b30 {



    margin-bottom: 30px;



}







.margin_b20 {



    margin-bottom: 20px;



}







.margin_b10 {



    margin-bottom: 10px;



}







.padding_t100 {



    padding-top: 100px;



}







.padding_t90 {



    padding-top: 90px;



}







.padding_t80 {



    padding-top: 80px;



}







.padding_t70 {



    padding-top: 70px;



}







.padding_t60 {



    padding-top: 60px;



}







.padding_t50 {



    padding-top: 50px;



}







.padding_t40 {



    padding-top: 40px;



}







.padding_t30 {



    padding-top: 30px;



}







.padding_t20 {



    padding-top: 20px;



}







.padding_t10 {



    padding-top: 10px;



}







.padding_b100 {



    padding-bottom: 100px;



}







.padding_b90 {



    padding-bottom: 90px;



}







.padding_b80 {



    padding-bottom: 80px;



}







.padding_b70 {



    padding-bottom: 70px;



}







.padding_b60 {



    padding-bottom: 60px;



}







.padding_b50 {



    padding-bottom: 50px;



}







.padding_b40 {



    padding-bottom: 40px;



}







.padding_b30 {



    padding-bottom: 30px;



}







.padding_b20 {



    padding-bottom: 20px;



}







.padding_b10 {



    padding-bottom: 10px;



}







.visible1800, .visible1000, .visible900, .visible768, .visible600, .visible500, .visible400, .visible360 {



    display: none;



}







/*重なりの優先度*/



.relative {



    position: relative;



}







.absolute {



    position: absolute;



}







/*要素固定*/



.fixed {



    position: fixed;



    z-index: 999;



}







.z0 {



    z-index: 0;



}







.z1 {



    z-index: 1;



}







.z2 {



    z-index: 2;



}







.z3 {



    z-index: 3;



}







.z4 {



    z-index: 4;



}







.z5 {



    z-index: 5;



}







.z6 {



    z-index: 6;



}







.z7 {



    z-index: 7;



}







.z8 {



    z-index: 8;



}







.z9 {



    z-index: 9;



}







.z10 {



    z-index: 10;



}







/*横幅*/



.w100 {



    width: 100%;



}







.w90 {



    width: 90%;



}







.w80 {



    width: 80%;



}







.w70 {



    width: 70%;



}







.w60 {



    width: 60%;



}







.w50 {



    width: 50%;



}







.w40 {



    width: 40%;



}







.w30 {



    width: 30%;



}







.w20 {



    width: 20%;



}







.w10 {



    width: 10%;



}







.disabled {



    pointer-events: none; /*リンクを無効にする*/



}







.vh100 {



    height: 100%;



    min-height: 100vh;



}







.content_wrapper {



    overflow-x: hidden;



}







.bold {



    font-weight: bold;



}







/*--------------------------------------------------------



定数（サイト毎に変化のある）



--------------------------------------------------------*/







.fullscreen {



    width: 100%;



    margin-left: auto;



    margin-right: auto;



}







.contents {



    width: 100%;



    max-width: 900px;



    margin-left: auto;



    margin-right: auto;


    max-width: 900px;
    margin-left: auto;
    margin-right: auto;
    background-color: #fffbec;
    background-image: radial-gradient(circle, #f1f1f1 4px, transparent 4px), radial-gradient(circle, #f1f1f1 4px, transparent 4px);
    background-position: 0 0, 34px 37px;
    background-size: 68px 74px;
}







.contents1800 {



    width: 100%;



    max-width: 1800px;



    margin-left: auto;



    margin-right: auto;



}







.contents1000 {



    width: 100%;



    max-width: 1000px;



    margin-left: auto;



    margin-right: auto;



}







.img_center {



    margin-left: -450px;



}







/*--------------------------------------------------------



animation



--------------------------------------------------------*/



/***********



* pickup *



************/



@keyframes pickup {



    0% {



        transform: scale(1);



    }



    50% {



        transform: scale(1.1);



    }



    100% {



        transform: scale(1);



    }



}



.pickup {



    display: block;



    animation-name: pickup;



    animation-duration: 1.5s;



    animation-fill-mode: both;



    animation-delay: 0s;



    animation-iteration-count: infinite;



}







/*--------------------------------------------------------



ヘッダー



--------------------------------------------------------*/



header {



    width: 100%;



    top: 0;



    margin: 0 auto;



    line-height: 0; /* 画像の上下に隙間が空いてしまう対策 */



}







/*--------------------------------------------------------



フッター



--------------------------------------------------------*/



footer {



    z-index: 2;



    text-align: center;



    color: #333;



    bottom: 0;



    left: 0;



    right: 0;



    padding: 2% 5%;



}







.copyright {



    justify-content: center;



    align-items: center;



}







.copyright a:hover {



    text-decoration: underline;



}







/*--------------------------------------------------------



↓↓↓ 各種レイアウト ↓↓↓



--------------------------------------------------------*/



.link_button {



    bottom: 1%;



}



/*--------------------------------------------------------



↑↑↑ 各種レイアウト ↑↑↑



--------------------------------------------------------*/







.video{



    z-index: 999;



    width: 95%;



    top: 28.3%;



    left: 2.6%;



    border-radius: 37px;



}



.footer{

    bottom: 0;

}


.padding_t200 {
    padding-top: 200px;
}

@media screen and (max-width: 900px) {
    .padding_t200 {
        padding-top: 22%;
    }
}