@charset "utf-8";


/*	html / body
===================================================== */

	html {
		font-size: 62.5%;
		-ms-text-size-adjust: 100%;
		-webkit-text-size-adjust: 100%;
		}
		@media screen and (-webkit-min-device-pixel-ratio:0) {
			::i-block-chrome, body {
				font-feature-settings: "pkna";
			}
		}

	body {
    line-height: 1.6;
    font-size: 1.6rem;
		letter-spacing: 0.1em;
		background-color: #fff;
		color: var(--cs-textcolor);
    font-family: var(--cs-basefont);
		}
		@media screen and (max-width: 767px) {
			body {
				font-size: 1.4rem;
				}	
		}



/*	 font
===================================================== */

  /* --- font family --- */
		@font-face {
			font-family: "YuGothic-M";
			font-weight: normal;
			src: local("YuGothic-Medium"), /* PostScript Name = localの正式な指定方法 */
				local("Yu Gothic Medium"),      /*PostScript Nameを認識できないChrome用にFull Nameを指定 */
				local("YuGothic-Regular");     /* 游ゴシックMediumが存在しないWindows8.1用 */
		}
		@font-face {
			font-family: "YuGothic-M";
			font-weight: bold;
			src: local("YuGothic-Bold"), 
				local("Yu Gothic Medium"),
				local("YuGothic Bold");
		}

  button {
    font-family: var(--cs-basefont);
    }

	.font-mincho {
		font-family: "ヒラギノ明朝 ProN W3", Hiragino Mincho ProN , Times New Roman , "游明朝", YuMincho, "MSP明朝","MS PMincho","MS 明朝",serif;
		}

	.font-meiryo {
		font-family: "メイリオ", Meiryo, Osaka, "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
		}






  /* --- font size --- */

  .fz-l { font-size: 110%; }
	.fz-s { font-size: 90%; }

  .fz-11 { font-size: 1.1rem; }
	.fz-12 { font-size: 1.2rem; }
	.fz-13 { font-size: 1.3rem; }
	.fz-14 { font-size: 1.4rem; }
	.fz-15 { font-size: 1.5rem; }
	.fz-16 { font-size: 1.6rem; }
	.fz-18 { font-size: 1.8rem; }
	.fz-20 { font-size: 2.0rem; }
	.fz-22 { font-size: 2.2rem; }
	.fz-24 { font-size: 2.4rem; }
	.fz-26 { font-size: 2.6rem; }


	.fz-14res { font-size: 1.4rem; }
		@media (max-width: 767px) {
			.fz-14res { font-size: 1.3rem; }
		}
	.fz-18res{ font-size: 1.8rem; }
		@media print, screen and (min-width: 768px) {
			.fz-18res-pc { font-size: 1.8rem; }
		}
		@media (max-width: 767px) {
			.fz-18res { font-size: 1.6rem; }
		}
	.fz-20res { font-size: 2.0rem; }
		@media print, screen and (min-width: 768px) {
			.fz-20res-pc { font-size: 2.0rem; }
		}
		@media (max-width: 767px) {
			.fz-20res { font-size: 1.6rem; }
		}
	.fz-22res { font-size: 2.2rem; }
		@media (max-width: 767px) {
			.fz-22res { font-size: 1.8rem; }
		}
	.fz-24res { font-size: 2.4rem; }
		@media print, screen and (min-width: 768px) {
			.fz-24res-pc { font-size: 2.4rem; }
		}
		@media (max-width: 767px) {
			.fz-24res { font-size: 2.0rem; }
		}
	.fz-26res { font-size: 2.6rem; }
		@media (max-width: 767px) {
			.fz-26res { font-size: 2.0rem; }
		}
	.fz-28res { font-size: 2.8rem; }
		@media (max-width: 767px) {
			.fz-28res { font-size: 2.0rem; }
		}
	.fz-30res { font-size: 3.0rem; }
		@media (max-width: 767px) {
			.fz-30res { font-size: 2.0rem; }
		}
	.fz-32res { font-size: 3.2rem; }
		@media (max-width: 767px) {
			.fz-32res { font-size: 2.0rem; }
		}
	.fz-34res { font-size: 3.4rem; }
		@media (max-width: 767px) {
			.fz-34res { font-size: 2.2rem; }
		}
	.fz-36res { font-size: 3.6rem; }
		@media (max-width: 767px) {
			.fz-36res { font-size: 2.2rem; }
		}
	.fz-40res { font-size: 4.0rem; }
		@media (max-width: 767px) {
			.fz-40res { font-size: 2.4rem; }
		}
	.fz-46res { font-size: 4.6rem; }
		@media (max-width: 767px) {
			.fz-46res { font-size: 2.4rem; }
		}
	.fz-54res { font-size: 5.4rem; }
		@media (max-width: 767px) {
			.fz-54res { font-size: 2.4rem; }
		}
	.fz-60res { font-size: 6.0rem; }
		@media (max-width: 767px) {
			.fz-60res { font-size: 2.6rem; }
		}
	.fz-80res { font-size: 8.0rem; }
		@media (max-width: 767px) {
			.fz-80res { font-size: 2.6rem; }
		}



  /* --- font weight --- */

	.fw-bold { font-weight: bold; }
	.fw-normal { font-weight: normal; }



  /* --- font style --- */

	.fs-italic { font-style: italic; }
	.fs-normal { font-style: normal; }





/*	 word / text
===================================================== */

  .wm-vrl { /* 縦書き */
    display: table-cell;
    vertical-align: middle;
      -webkit-writing-mode: vertical-rl;
          -ms-writing-mode: tb-rl;
              writing-mode: vertical-rl;
    }

  .wb-all { word-break: break-all; }
  .wb-word { word-break: break-word; }
  .wb-keep { word-break: keep-all; }

	.indent-1 { text-indent: 1em; }
	.indent-icon {
    text-indent: -1em;
    padding-left: 1em;
    }



	.t-spacing-no { letter-spacing: -0.5em; }
	.t-spacing-narrow { letter-spacing: -1px!important; }
	.t-spacing-xw { letter-spacing: 6px; }
		@media (max-width: 767px) {
    	.t-spacing-xw { letter-spacing: 2px; }
		}


	.lineheight-0 { line-height: 0; }
	.lineheight-1 { line-height: 1; }
	.lineheight-12 { line-height: 1.2; }
	.lineheight-18 { line-height: 1.8; }
	.lineheight-20 { line-height: 2.0; }
	.lineheight-25 { line-height: 2.5; }
	.lineheight-w { line-height: 2; }
	.lineheight-xw { line-height: 2.5; }
		@media (max-width: 767px) {
			.lineheight-w { line-height: 1.5; }
    	.lineheight-xw { line-height: 2.0; }
		}




/*	 img
===================================================== */

	img {
		max-width: 100%;
		height: auto;
		width: auto;
		}
	img { -ms-interpolation-mode: bicubic; }
	
	img.img-100 { width: 100%; }

	@media print, screen and (min-width: 768px) {
    img.img-sp {display: none;}
    img.img-30-pc { max-width: 30%; }
  	img.img-50-pc { max-width: 50%; }
  	img.img-80-pc { max-width: 80%; }
	}
	@media (max-width: 767px) {
    img.img-pc {display: none;}
  	img.img-30-sp { max-width: 30%; }
  	img.img-50-sp { max-width: 50%; }
  	img.img-80-sp { max-width: 80%; }
	}



/*	 a
===================================================== */

	a {
		color: var(--cs-textcolor-a);
		text-decoration: underline;
		-webkit-transition: all 0.5s ease-in-out;
		-moz-transition: all 0.5s ease-in-out;
		-o-transition: all 0.5s ease-in-out;
		-ms-transition: all 0.5s ease-in-out;
		transition: all 0.5s ease-in-out;
		}

	.a-linktrans a {
		-webkit-transition: all 0.5s ease-in-out;
		-moz-transition: all 0.5s ease-in-out;
		-o-transition: all 0.5s ease-in-out;
		-ms-transition: all 0.5s ease-in-out;
		transition: all 0.5s ease-in-out;
		}


	a.a-underline {
		color: var(--cs-textcolor)!important;
		text-decoration: underline!important;
		}
	a.a-nounderline-hover,
	a.a-nounderline {
		color: var(--cs-textcolor)!important;
		text-decoration: none!important;
		}
	a.a-nounderline:hover {
		text-decoration: underline!important;
		}
	a.a-nounderline-hover:hover {
		text-decoration: none!important;
		}

	@media print, screen and (min-width: 768px) {
    a:hover {
      color: var(--cs-textcolor-hover);
      }
		a:hover img {
			opacity:0.7;
			filter: alpha(opacity=70);
			-ms-filter: "alpha( opacity=70 )";
			}	
		a.a-bright:hover img {
			opacity:1;
			filter: alpha(opacity=100);
			-ms-filter: "alpha( opacity=100 )";
			 -webkit-filter: brightness(1.2);
			 -moz-filter: brightness(1.2);
			 -o-filter: brightness(1.2);
			 -ms-filter: brightness(1.2);
			 filter: brightness(1.2);
			}	
		 a.a-noOpacity:hover img {
			opacity:1;
			filter: alpha(opacity=100);
			-ms-filter: "alpha( opacity=100 )";
			}
		 a.a-hoverShadow {
      display: block;
      width: 100%;
      height: 100%;
      line-height: 0;
      }
		 a.a-hoverShadow:hover {
  -webkit-box-shadow: 0 3px 5px rgba(0, 0, 0, .9);
      box-shadow: 0 3px 5px rgba(0, 0, 0, .9);
    -webkit-transform: translate(0, -2px);
      -ms-transform: translate(0, -2px);
        transform: translate(0, -2px);
    -webkit-transition: all 0.5s;
        transition: all 0.5s;
			}
		a.a-hoverShadow01 {
      display: block;
      width: 100%;
      height: 100%;
      line-height: 0;
  -webkit-box-shadow: 2px 2px 4px #E5DFD9;
      box-shadow: 2px 2px 4px #E5DFD9;
      }
		 a.a-hoverShadow01:hover {
  -webkit-box-shadow: 2px 2px 4px #1F1F1F;
      box-shadow: 2px 2px 4px #1F1F1F;
    -webkit-transform: translate(0, 2px);
      -ms-transform: translate(0, 2px);
        transform: translate(0, 2px);
    -webkit-transition: all 0.5s;
        transition: all 0.5s;
			}
	}
	@media screen and (max-width: 767px) {
    a.a-underline-sp {
      text-decoration: underline!important;
      }
	}


	a[href^="tel:"] { 
		cursor: default;
	  pointer-events: none;
		}
	@media print, screen and (min-width: 768px) {
		a[href^="tel:"] { 
      text-decoration: none;
			}
	}
	@media screen and (max-width: 767px) {
		a[href^="tel:"] { 
			pointer-events: auto;
			}
	}


  /* aタグをボタンをして使用する場合 */
  .a-linkbtn-icon,
  .a-linkbtn {
		box-sizing: border-box;
    width: 100%;
    /* height: 100%; */
    text-decoration: none;
    border: 2px solid var(--cs-bordercolor);
    font-weight: bold;
    letter-spacing: 0.5px;
    line-height: 1.4;
    padding: 10px 15px;
    margin: 0 auto;
    display: -webkit-flex;
    display: flex;
    gap: 10px;
    position: relative;
    }
  .a-linkbtn > * {
		display: -webkit-box!important;
		display: -moz-box!important;
		display: -ms-flexbox!important;
		display: -webkit-flex!important;
		display: flex!important;
		-webkit-flex-direction: column;
		flex-direction: column;
		-webkit-justify-content: center;
		justify-content: center;
    }



  .a-linkbtn-icon__left {
    position: absolute;
    top: calc(50% - .5em);
    left: 15px;
    }
  .a-linkbtn-icon__right {
    position: absolute;
    top: calc(50% - .5em);
    right: 15px;
    }


  /* aタグの文字色 */
  .a-text__blue { color: var(--cs-blue)!important; }
  .a-text__blue-light { color: var(--cs-blue-light)!important; }
  .a-text__blue-dark { color: var(--cs-blue-dark)!important; }
  .a-text__navy { color: var(--cs-navy)!important; }
  .a-text__purple { color: var(--cs-purple)!important; }
  .a-text__pink { color: var(--cs-pink)!important; }
  .a-text__pink-light { color: var(--cs-pink-light)!important; }
  .a-text__red { color: var(--cs-red)!important; }
  .a-text__red-light { color: var(--cs-red-light)!important; }
  .a-text__red-dark { color: var(--cs-red-dark)!important; }
  .a-text__orange { color: var(--cs-orange)!important; }
  .a-text__yellow { color: var(--cs-yellow)!important; }
  .a-text__green { color: var(--cs-green)!important; }
  .a-text__green-light { color: var(--cs-green-light)!important; }
  .a-text__brown { color: var(--cs-brown)!important; }
  .a-text__brown-light { color: var(--cs-brown-light)!important; }
  .a-text__brown-dark { color: var(--cs-brown-dark)!important; }
  .a-text__black { color: var(--cs-black)!important; }
  .a-text__white { color: var(--cs-white)!important; }
  .a-text__gray { color: var(--cs-gray)!important; }
  .a-text__gray-light { color: var(--cs-gray-light)!important; }
  .a-text__gray-dark { color: var(--cs-gray-dark)!important; }
  .a-text__color01 { color: var(--cs-color01)!important; }
  .a-text__color02 { color: var(--cs-color02)!important; }
  .a-text__color03 { color: var(--cs-color03)!important; }
  .a-text__color04 { color: var(--cs-color04)!important; }
  .a-text__color05 { color: var(--cs-color05)!important; }
  .a-text__color06 { color: var(--cs-color06)!important; }
  .a-text__color07 { color: var(--cs-color07)!important; }
  .a-text__color08 { color: var(--cs-color08)!important; }
  .a-text__color09 { color: var(--cs-color09)!important; }
  .a-text__color10 { color: var(--cs-color10)!important; }


  /* aタグ(hover)の文字色 */
  .a-text__blue-hover:hover { color: var(--cs-blue)!important; }
  .a-text__blue-light-hover:hover { color: var(--cs-blue-light)!important; }
  .a-text__blue-dark-hover:hover { color: var(--cs-blue-dark)!important; }
  .a-text__navy-hover:hover { color: var(--cs-navy)!important; }
  .a-text__purple-hover:hover { color: var(--cs-purple)!important; }
  .a-text__pink-hover:hover { color: var(--cs-pink)!important; }
  .a-text__pink-light-hover:hover { color: var(--cs-pink-light)!important; }
  .a-text__red-hover:hover { color: var(--cs-red)!important; }
  .a-text__red-light-hover:hover { color: var(--cs-red-light)!important; }
  .a-text__red-dark-hover:hover { color: var(--cs-red-dark)!important; }
  .a-text__orange-hover:hover { color: var(--cs-orange)!important; }
  .a-text__yellow-hover:hover { color: var(--cs-yellow)!important; }
  .a-text__green-hover:hover { color: var(--cs-green)!important; }
  .a-text__green-light-hover:hover { color: var(--cs-green-light)!important; }
  .a-text__brown-hover:hover { color: var(--cs-brown)!important; }
  .a-text__brown-light-hover:hover { color: var(--cs-brown-light)!important; }
  .a-text__brown-dark-hover:hover { color: var(--cs-brown-dark)!important; }
  .a-text__black-hover:hover { color: var(--cs-black)!important; }
  .a-text__white-hover:hover { color: var(--cs-white)!important; }
  .a-text__gray-hover:hover { color: var(--cs-gray)!important; }
  .a-text__gray-light-hover:hover { color: var(--cs-gray-light)!important; }
  .a-text__gray-dark-hover:hover { color: var(--cs-gray-dark)!important; }
  .a-text__color01-hover:hover { color: var(--cs-color01)!important; }
  .a-text__color02-hover:hover { color: var(--cs-color02)!important; }
  .a-text__color03-hover:hover { color: var(--cs-color03)!important; }
  .a-text__color04-hover:hover { color: var(--cs-color04)!important; }
  .a-text__color05-hover:hover { color: var(--cs-color05)!important; }
  .a-text__color06-hover:hover { color: var(--cs-color06)!important; }
  .a-text__color07-hover:hover { color: var(--cs-color07)!important; }
  .a-text__color08-hover:hover { color: var(--cs-color08)!important; }
  .a-text__color09-hover:hover { color: var(--cs-color09)!important; }
  .a-text__color10-hover:hover { color: var(--cs-color10)!important; }


  /* aタグの背景色 */
	.a-back__blue      	{ background-color: var(--cs-blue); }
	.a-back__blue-light 	{ background-color: var(--cs-blue-light); }
	.a-back__blue-dark  	{ background-color: var(--cs-blue-dark); }
	.a-back__navy      	{ background-color: var(--cs-navy); }
	.a-back__purple      { background-color: var(--cs-purple); }
	.a-back__pink      	{ background-color: var(--cs-pink); }
	.a-back__pink-light  { background-color: var(--cs-pink-light); }
	.a-back__red      	  { background-color: var(--cs-red); }
	.a-back__red-light 	{ background-color: var(--cs-red-light); }
	.a-back__red-dark  	{ background-color: var(--cs-red-dark); }
	.a-back__orange      { background-color: var(--cs-orange); }
	.a-back__yellow      { background-color: var(--cs-yellow); }
	.a-back__green      	{ background-color: var(--cs-green); }
	.a-back__green-light { background-color: var(--cs-green-light); }
	.a-back__brown      	{ background-color: var(--cs-brown); }
	.a-back__brown-light { background-color: var(--cs-brown-light); }
	.a-back__brown-dark  { background-color: var(--cs-brown-dark); }
	.a-back__black      	{ background-color: var(--cs-black); }
	.a-back__blue      	{ background-color: var(--cs-blue); }
	.a-back__white      	{ background-color: var(--cs-white); }
	.a-back__gray      	{ background-color: var(--cs-gray); }
	.a-back__gray-light  { background-color: var(--cs-gray-light); }
	.a-back__gray-dark   { background-color: var(--cs-gray-dark); }
	.a-back__color01     { background-color: var(--cs-color01); }
	.a-back__color02     { background-color: var(--cs-color02); }
	.a-back__color03     { background-color: var(--cs-color03); }
	.a-back__color04     { background-color: var(--cs-color04); }
	.a-back__color05     { background-color: var(--cs-color05); }
	.a-back__color06     { background-color: var(--cs-color06); }
	.a-back__color07     { background-color: var(--cs-color07); }
	.a-back__color08     { background-color: var(--cs-color08); }
	.a-back__color09     { background-color: var(--cs-color09); }
	.a-back__color10     { background-color: var(--cs-color10); }


  /* aタグ(hover)の背景色 */
	.a-back__blue-hover:hover      	{ background-color: var(--cs-blue); }
	.a-back__blue-light-hover:hover 	{ background-color: var(--cs-blue-light); }
	.a-back__blue-dark-hover:hover  	{ background-color: var(--cs-blue-dark); }
	.a-back__navy-hover:hover      	{ background-color: var(--cs-navy); }
	.a-back__purple-hover:hover      { background-color: var(--cs-purple); }
	.a-back__pink-hover:hover      	{ background-color: var(--cs-pink); }
	.a-back__pink-light-hover:hover  { background-color: var(--cs-pink-light); }
	.a-back__red-hover:hover      	  { background-color: var(--cs-red); }
	.a-back__red-light-hover:hover 	{ background-color: var(--cs-red-light); }
	.a-back__red-dark-hover:hover  	{ background-color: var(--cs-red-dark); }
	.a-back__orange-hover:hover      { background-color: var(--cs-orange); }
	.a-back__yellow-hover:hover      { background-color: var(--cs-yellow); }
	.a-back__green-hover:hover      	{ background-color: var(--cs-green); }
	.a-back__green-light-hover:hover { background-color: var(--cs-green-light); }
	.a-back__brown-hover:hover      	{ background-color: var(--cs-brown); }
	.a-back__brown-light-hover:hover { background-color: var(--cs-brown-light); }
	.a-back__brown-dark-hover:hover  { background-color: var(--cs-brown-dark); }
	.a-back__black-hover:hover      	{ background-color: var(--cs-black); }
	.a-back__blue-hover:hover      	{ background-color: var(--cs-blue); }
	.a-back__white-hover:hover      	{ background-color: var(--cs-white); }
	.a-back__gray-hover:hover      	{ background-color: var(--cs-gray); }
	.a-back__gray-light-hover:hover  { background-color: var(--cs-gray-light); }
	.a-back__gray-dark-hover:hover   { background-color: var(--cs-gray-dark); }
	.a-back__color01-hover:hover     { background-color: var(--cs-color01); }
	.a-back__color02-hover:hover     { background-color: var(--cs-color02); }
	.a-back__color03-hover:hover     { background-color: var(--cs-color03); }
	.a-back__color04-hover:hover     { background-color: var(--cs-color04); }
	.a-back__color05-hover:hover     { background-color: var(--cs-color05); }
	.a-back__color06-hover:hover     { background-color: var(--cs-color06); }
	.a-back__color07-hover:hover     { background-color: var(--cs-color07); }
	.a-back__color08-hover:hover     { background-color: var(--cs-color08); }
	.a-back__color09-hover:hover     { background-color: var(--cs-color09); }
	.a-back__color10-hover:hover     { background-color: var(--cs-color10); }


  /* aタグのボーダー色 */
  .a-border__blue { border-color: var(--cs-blue); }
  .a-border__blue-light { border-color: var(--cs-blue-light); }
  .a-border__blue-dark { border-color: var(--cs-blue-dark); }
  .a-border__navy { border-color: var(--cs-navy); }
  .a-border__purple { border-color: var(--cs-purple); }
  .a-border__pink { border-color: var(--cs-pink); }
  .a-border__pink-light { border-color: var(--cs-pink-light); }
  .a-border__red { border-color: var(--cs-red); }
  .a-border__red-light { border-color: var(--cs-red-light); }
  .a-border__red-dark { border-color: var(--cs-red-dark); }
  .a-border__orange { border-color: var(--cs-orange); }
  .a-border__yellow { border-color: var(--cs-yellow); }
  .a-border__green { border-color: var(--cs-green); }
  .a-border__green-light { border-color: var(--cs-green-light); }
  .a-border__brown { border-color: var(--cs-brown); }
  .a-border__brown-light { border-color: var(--cs-brown-light); }
  .a-border__brown-dark { border-color: var(--cs-brown-dark); }
  .a-border__black { border-color: var(--cs-black); }
  .a-border__white { border-color: var(--cs-white); }
  .a-border__gray { border-color: var(--cs-gray); }
  .a-border__gray-light { border-color: var(--cs-gray-light); }
  .a-border__gray-dark { border-color: var(--cs-gray-dark); }
  .a-border__color01 { border-color: var(--cs-color01); }
  .a-border__color02 { border-color: var(--cs-color02); }
  .a-border__color03 { border-color: var(--cs-color03); }
  .a-border__color04 { border-color: var(--cs-color04); }
  .a-border__color05 { border-color: var(--cs-color05); }
  .a-border__color06 { border-color: var(--cs-color06); }
  .a-border__color07 { border-color: var(--cs-color07); }
  .a-border__color08 { border-color: var(--cs-color08); }
  .a-border__color09 { border-color: var(--cs-color09); }
  .a-border__color10 { border-color: var(--cs-color10); }


  /* aタグ(hover)のボーダー色 */
  .a-border__blue-hover:hover { border-color: var(--cs-blue); }
  .a-border__blue-light-hover:hover { border-color: var(--cs-blue-light); }
  .a-border__blue-dark-hover:hover { border-color: var(--cs-blue-dark); }
  .a-border__navy-hover:hover { border-color: var(--cs-navy); }
  .a-border__purple-hover:hover { border-color: var(--cs-purple); }
  .a-border__pink-hover:hover { border-color: var(--cs-pink); }
  .a-border__pink-light-hover:hover { border-color: var(--cs-pink-light); }
  .a-border__red-hover:hover { border-color: var(--cs-red); }
  .a-border__red-light-hover:hover { border-color: var(--cs-red-light); }
  .a-border__red-dark-hover:hover { border-color: var(--cs-red-dark); }
  .a-border__orange-hover:hover { border-color: var(--cs-orange); }
  .a-border__yellow-hover:hover { border-color: var(--cs-yellow); }
  .a-border__green-hover:hover { border-color: var(--cs-green); }
  .a-border__green-light-hover:hover { border-color: var(--cs-green-light); }
  .a-border__brown-hover:hover { border-color: var(--cs-brown); }
  .a-border__brown-light-hover:hover { border-color: var(--cs-brown-light); }
  .a-border__brown-dark-hover:hover { border-color: var(--cs-brown-dark); }
  .a-border__black-hover:hover { border-color: var(--cs-black); }
  .a-border__white-hover:hover { border-color: var(--cs-white); }
  .a-border__gray-hover:hover { border-color: var(--cs-gray); }
  .a-border__gray-light-hover:hover { border-color: var(--cs-gray-light); }
  .a-border__gray-dark-hover:hover { border-color: var(--cs-gray-dark); }
  .a-border__color01-hover:hover { border-color: var(--cs-color01); }
  .a-border__color02-hover:hover { border-color: var(--cs-color02); }
  .a-border__color03-hover:hover { border-color: var(--cs-color03); }
  .a-border__color04-hover:hover { border-color: var(--cs-color04); }
  .a-border__color05-hover:hover { border-color: var(--cs-color05); }
  .a-border__color06-hover:hover { border-color: var(--cs-color06); }
  .a-border__color07-hover:hover { border-color: var(--cs-color07); }
  .a-border__color08-hover:hover { border-color: var(--cs-color08); }
  .a-border__color09-hover:hover { border-color: var(--cs-color09); }
  .a-border__color10-hover:hover { border-color: var(--cs-color10); }




/*	 utilities
===================================================== */
	
	.clear { clear: both; }
	.clearfix:after {
		content: " ";
		display: block;
		clear: both;
		}

	.relative { position: relative; }
	.boxsizing-b {
		box-sizing: border-box;
		}

	.overhidden { overflow: hidden; }



  /* --- display --- */
	.display-none { display: none; }
	.display-inline { display: inline; }
	.display-inblock { display: inline-block; }
	.display-block { display: block; }

    @media print, screen and (min-width: 768px) {
			.display-block-pc { display: block;}
      .display-none-pc { display:none; }
    }
		@media (max-width: 767px) {
			.display-block-sp { display: block;}
			.display-none-sp { display: none;}
		}
		@media (max-width: 400px) {
			.display-block-xs { display: block;}
			.display-none-xs { display: none;}
		}


  /* br */
	.br-pc { display: none;}
	.br-sp { display: none;}
	.br-xs { display: none;}
	.br-xxs { display: none;}
		@media print, screen and (min-width: 768px) {
			.br-pc { display: block;}
		}
		@media (max-width: 767px) {
			.br-sp { display: block;}
		}
		@media (max-width: 400px) {
			.br-xs { display: block;}
		}
		@media (max-width: 360px) {
			.br-xxs { display: block;}
		}



  /* --- layout --- */
	.fln { float: none; }
	.fll { float: left; }
	.flr { float: right; }
	
	.tal { text-align: left; }
	.tac { text-align: center; }
	.tar { text-align: right; }
	@media print, screen and (min-width: 768px) {
		.tac-tal-res {
			text-align: center; 
			}
		.tac-tar-res {
			text-align: center; 
			}
		.tal-tac-res {
			text-align: left; 
			}
		.tar-tac-res {
			text-align: right; 
			}
		.tar-tal-res {
			text-align: right; 
			}
	}
	@media (max-width: 767px) {
		.tac-tal-res {
			text-align: left; 
			}
		.tac-tar-res {
			text-align: right; 
			}
		.tal-tac-res {
			text-align: center; 
			}
		.tar-tac-res {
			text-align: center; 
			}
		.tar-tal-res {
			text-align: left; 
			}
	}


	.vat {vertical-align: top; }
	.vab {vertical-align: bottom; }
	.vam {vertical-align: middle; }


	.itemscenter {
		display: -webkit-box!important;
		display: -moz-box!important;
		display: -ms-flexbox!important;
		display: -webkit-flex!important;
		display: flex!important;
		-webkit-flex-direction: column;
		flex-direction: column;
		-webkit-justify-content: center;
		justify-content: center;
		-webkit-align-items: center;
		align-items: center;
		}
		.itemscenter img {
			flex-shrink: 0;
			}
		@media print, screen and (min-width: 768px) {
			.itemscenter-pc {
				display: -webkit-box!important;
				display: -moz-box!important;
				display: -ms-flexbox!important;
				display: -webkit-flex!important;
				display: flex!important;
				-webkit-flex-direction: column;
				flex-direction: column;
				-webkit-justify-content: center;
				justify-content: center;
				-webkit-align-items: center;
				align-items: center;
				}
				.itemscenter-pc img {
					flex-shrink: 0;
					}
		}

	.itemscenter-vertical {
		display: -webkit-box!important;
		display: -moz-box!important;
		display: -ms-flexbox!important;
		display: -webkit-flex!important;
		display: flex!important;
		-webkit-flex-direction: column;
		flex-direction: column;
		-webkit-justify-content: center;
		justify-content: center;
		}
		.itemscenter-vertical img {
			flex-shrink: 0;
			}



  /* --- flex --- */
  .flex-1 {	flex: 1;	}
	

  /* --- order --- */
	@media print, screen and (min-width: 768px) {
		.order-1-pc {	order: 1;	}
		.order-2-pc {	order: 2;	}
		.order-3-pc {	order: 3;	}
		.order-4-pc {	order: 4;	}
		.order-5-pc {	order: 5;	}
	}
	@media (max-width: 767px) {
		.order-1-sp {	order: 1;	}
		.order-2-sp {	order: 2;	}
		.order-3-sp {	order: 3;	}
		.order-4-sp {	order: 4;	}
		.order-5-sp {	order: 5;	}
	}




/*	spacing
===================================================== */

	/* section (px) */
	@media print, screen and (min-width: 768px) {
		.sec-paddingL {
			padding-top: 100px;
			padding-bottom: 100px;
			}
      .sec-paddingL-top {
        padding-top: 100px;
        }
      .sec-paddingL-bottom {
        padding-bottom: 100px;
        }
		.sec-padding {
			padding-top: 60px;
			padding-bottom: 60px;
			}
      .sec-padding-top {
        padding-top: 60px;
        }
      .sec-padding-bottom {
        padding-bottom: 60px;
        }
		.sec-paddingS {
			padding-top: 30px;
			padding-bottom: 30px;
			}
      .sec-paddingS-top {
        padding-top: 30px;
        }
      .sec-paddingS-bottom {
        padding-bottom: 30px;
        }
	}
	@media (max-width: 767px) {
		.sec-paddingL {
			padding-top: 50px;
			padding-bottom: 50px;
			}
      .sec-paddingL-top {
        padding-top: 50px;
        }
      .sec-paddingL-bottom {
        padding-bottom: 50px;
        }
		.sec-padding {
			padding-top: 30px;
			padding-bottom: 30px;
			}
      .sec-padding-top {
        padding-top: 30px;
        }
      .sec-padding-bottom {
        padding-bottom: 30px;
        }
		.sec-paddingS {
			padding-top: 20px;
			padding-bottom: 20px;
			}
      .sec-paddingS-top {
        padding-top: 20px;
        }
      .sec-paddingS-bottom {
        padding-bottom: 20px;
        }
	}



	/* margin (px) */
		.ma-a { margin: auto; }
		.mt-a { margin-top: auto; }
		.mr-a { margin-right: auto; }
		.mb-a { margin-bottom: auto; }
		.ml-a { margin-left: auto; }

		.ma-0 { margin: 0!important; }
		.mt-0 { margin-top: 0 !important; }
		.mr-0 { margin-right: 0 !important; }
		.mb-0 { margin-bottom: 0 !important; }
		.ml-0 { margin-left: 0 !important; }

		.ma-5 { margin: 5px!important; }
    .mt-5 { margin-top:    5px !important;}
		.mr-5 { margin-right:  5px !important;}
		.mb-5 { margin-bottom: 5px !important;}
		.ml-5 { margin-left:   5px !important;}
			 
		.ma-10 { margin: 10px!important; }
		.mt-10 { margin-top:    10px !important;}
		.mr-10 { margin-right:  10px !important;}
		.mb-10 { margin-bottom: 10px !important;}
		.ml-10 { margin-left:   10px !important;}
		
		.ma-15 { margin: 15px!important; }
		.mt-15 { margin-top:    15px !important;}
		.mr-15 { margin-right:  15px !important;}
		.mb-15 { margin-bottom: 15px !important;}
		.ml-15 { margin-left:   15px !important;}
		
		.ma-20 { margin: 20px!important; }
		.mt-20 { margin-top:    20px !important;}
		.mr-20 { margin-right:  20px !important;}
		.mb-20 { margin-bottom: 20px !important;}
		.ml-20 { margin-left:   20px !important;}
		
		.ma-25 { margin: 25px!important; }
		.mt-25 { margin-top:    25px !important;}
		.mr-25 { margin-right:  25px !important;}
		.mb-25 { margin-bottom: 25px !important;}
		.ml-25 { margin-left:   25px !important;}
		
		.ma-30 { margin: 30px!important; }
		.mt-30 { margin-top:    30px !important;}
		.mr-30 { margin-right:  30px !important;}
		.mb-30 { margin-bottom: 30px !important;}
		.ml-30 { margin-left:   30px !important;}
		
		.ma-40 { margin: 40px!important; }
		.mt-40 { margin-top:    40px !important;}
		.mr-40 { margin-right:  40px !important;}
		.mb-40 { margin-bottom: 40px !important;}
		.ml-40 { margin-left:   40px !important;}
		
		.ma-50 { margin: 50px!important; }
		.mt-50 { margin-top:    50px !important;}
		.mr-50 { margin-right:  50px !important;}
		.mb-50 { margin-bottom: 50px !important;}
		.ml-50 { margin-left:   50px !important;}	

    .ma-60 { margin: 60px!important; }
    .mt-60 { margin-top:    60px !important;}
    .mr-60 { margin-right:  60px !important;}
    .mb-60 { margin-bottom: 60px !important;}
    .ml-60 { margin-left:   60px !important;}	

    .ma-70 { margin: 70px!important; }
    .mt-70 { margin-top:    70px !important;}
    .mr-70 { margin-right:  70px !important;}
    .mb-70 { margin-bottom: 70px !important;}
    .ml-70 { margin-left:   70px !important;}	

    .ma-80 { margin: 80px!important; }
    .mt-80 { margin-top:    80px !important;}
    .mr-80 { margin-right:  80px !important;}
    .mb-80 { margin-bottom: 80px !important;}
    .ml-80 { margin-left:   80px !important;}	

    .ma-80 { margin: 90px!important; }
    .mt-80 { margin-top:    90px !important;}
    .mr-80 { margin-right:  90px !important;}
    .mb-80 { margin-bottom: 90px !important;}
    .ml-80 { margin-left:   90px !important;}	

    .ma-100 { margin: 100px!important; }
    .mt-100 { margin-top:    100px !important;}
    .mr-100 { margin-right:  100px !important;}
    .mb-100 { margin-bottom: 100px !important;}
    .ml-100 { margin-left:   100px !important;}	


      @media print, screen and (min-width: 768px) {
        .mt-30-res		{ margin-top: 30px; }
        .mb-30-res		{ margin-bottom: 30px; }
        .mt-40-res		{ margin-top: 40px; }
        .mb-40-res		{ margin-bottom: 40px; }
        .mt-50-res		{ margin-top: 50px; }
        .mb-50-res		{ margin-bottom: 50px; }
        .mt-60-res		{ margin-top: 60px; }
        .mb-60-res		{ margin-bottom: 60px; }
        .mt-70-res		{ margin-top: 70px; }
        .mb-70-res		{ margin-bottom: 70px; }
        .mt-80-res		{ margin-top: 80px; }
        .mb-80-res		{ margin-bottom: 80px; }
        .mt-90-res		{ margin-top: 90px; }
        .mb-90-res		{ margin-bottom: 90px; }
        .mt-100-res		{ margin-top: 100px; }
        .mb-100-res   { margin-bottom: 100px;}	
      }
      @media (max-width: 767px) {
        .mt-30-res		{ margin-top: 20px; }
        .mb-30-res		{ margin-bottom: 20px; }
        .mt-40-res		{ margin-top: 20px; }
        .mb-40-res		{ margin-bottom: 20px; }
        .mt-50-res		{ margin-top: 25px; }
        .mb-50-res		{ margin-bottom: 25px; }
        .mt-60-res		{ margin-top: 25px; }
        .mb-60-res		{ margin-bottom: 25px; }
        .mt-70-res		{ margin-top: 30px; }
        .mb-70-res		{ margin-bottom: 30px; }
        .mt-80-res		{ margin-top: 30px; }
        .mb-80-res		{ margin-bottom: 30px; }
        .mt-90-res		{ margin-top: 40px; }
        .mb-90-res		{ margin-bottom: 40px; }
        .mt-100-res		{ margin-top: 60px; }
        .mb-100-res		{ margin-bottom: 60px; }
      }



	
	
	/* padding (px) */
		.pa-a { padding: auto; }
		.pt-a { padding-top: auto; }
		.pr-a { padding-right: auto; }
		.pb-a { padding-bottom: auto; }
		.pl-a { padding-left: auto; }

		.pa-0 { padding: 0!important; }
		.pt-0 { padding-top: 0 !important; }
		.pr-0 { padding-right: 0 !important; }
		.pb-0 { padding-bottom: 0 !important; }
		.pl-0 { padding-left: 0 !important; }

		.pa-5 { padding: 5px!important; }
    .pt-5 { padding-top:    5px !important;}
		.pr-5 { padding-right:  5px !important;}
		.pb-5 { padding-bottom: 5px !important;}
		.pl-5 { padding-left:   5px !important;}
			 
		.pa-10 { padding: 10px!important; }
		.pt-10 { padding-top:    10px !important;}
		.pr-10 { padding-right:  10px !important;}
		.pb-10 { padding-bottom: 10px !important;}
		.pl-10 { padding-left:   10px !important;}
		
		.pa-15 { padding: 15px!important; }
		.pt-15 { padding-top:    15px !important;}
		.pr-15 { padding-right:  15px !important;}
		.pb-15 { padding-bottom: 15px !important;}
		.pl-15 { padding-left:   15px !important;}
		
		.pa-20 { padding: 20px!important; }
		.pt-20 { padding-top:    20px !important;}
		.pr-20 { padding-right:  20px !important;}
		.pb-20 { padding-bottom: 20px !important;}
		.pl-20 { padding-left:   20px !important;}
		
		.pa-25 { padding: 25px!important; }
		.pt-25 { padding-top:    25px !important;}
		.pr-25 { padding-right:  25px !important;}
		.pb-25 { padding-bottom: 25px !important;}
		.pl-25 { padding-left:   25px !important;}
		
		.pa-30 { padding: 30px!important; }
		.pt-30 { padding-top:    30px !important;}
		.pr-30 { padding-right:  30px !important;}
		.pb-30 { padding-bottom: 30px !important;}
		.pl-30 { padding-left:   30px !important;}
		
		.pa-40 { padding: 40px!important; }
		.pt-40 { padding-top:    40px !important;}
		.pr-40 { padding-right:  40px !important;}
		.pb-40 { padding-bottom: 40px !important;}
		.pl-40 { padding-left:   40px !important;}
		
		.pa-50 { padding: 50px!important; }
		.pt-50 { padding-top:    50px !important;}
		.pr-50 { padding-right:  50px !important;}
		.pb-50 { padding-bottom: 50px !important;}
		.pl-50 { padding-left:   50px !important;}	
		
		.pa-60 { padding: 60px!important; }
		.pt-60 { padding-top:    60px !important;}
		.pr-60 { padding-right:  60px !important;}
		.pb-60 { padding-bottom: 60px !important;}
		.pl-60 { padding-left:   60px !important;}	
		
		.pa-70 { padding: 70px!important; }
		.pt-70 { padding-top:    70px !important;}
		.pr-70 { padding-right:  70px !important;}
		.pb-70 { padding-bottom: 70px !important;}
		.pl-70 { padding-left:   70px !important;}	
		
		.pa-80 { padding: 80px!important; }
		.pt-80 { padding-top:    80px !important;}
		.pr-80 { padding-right:  80px !important;}
		.pb-80 { padding-bottom: 80px !important;}
		.pl-80 { padding-left:   80px !important;}	
		
		.pa-90 { padding: 90px!important; }
		.pt-90 { padding-top:    90px !important;}
		.pr-90 { padding-right:  90px !important;}
		.pb-90 { padding-bottom: 90px !important;}
		.pl-90 { padding-left:   90px !important;}	
		
		.pa-100 { padding: 100px!important; }
		.pt-100 { padding-top:    100px !important;}
		.pr-100 { padding-right:  100px !important;}
		.pb-100 { padding-bottom: 100px !important;}
		.pl-100 { padding-left:   100px !important;}	

      @media print, screen and (min-width: 768px) {
        .pa-10-res		{ padding: 10px; }
        .pa-20-res		{ padding: 20px; }
        .pa-30-res10	{ padding: 30px; }
        .pa-30-res20	{ padding: 30px; }
        .pa-1030-res  { padding: 10px 30px; }
        .pa-4050-res  { padding: 40px 50px; }
        
        .pt-25-res		{ padding-top: 25px; }
        .pr-25-res		{ padding-right: 25px; }
        .pb-25-res		{ padding-bottom: 25px; }
        .pl-25-res		{ padding-left: 25px; }
        
        .pt-30-res		{ padding-top: 30px; }
        .pr-30-res		{ padding-right: 30px; }
        .pb-30-res		{ padding-bottom: 30px; }
        .pl-30-res		{ padding-left: 30px; }
        
        .pt-40-res		{ padding-top: 40px; }
        .pr-40-res		{ padding-right: 40px; }
        .pb-40-res		{ padding-bottom: 40px; }
        .pl-40-res		{ padding-left: 40px; }
        
        .pt-50-res		{ padding-top: 50px; }
        .pr-50-res		{ padding-right: 50px; }
        .pb-50-res		{ padding-bottom: 50px; }
        .pl-50-res		{ padding-left: 50px; }
        
        .pt-60-res		{ padding-top: 60px; }
        .pr-60-res		{ padding-right: 60px; }
        .pb-60-res		{ padding-bottom: 60px; }
        .pl-60-res		{ padding-left: 60px; }
        
        .pt-70-res		{ padding-top: 70px; }
        .pr-70-res		{ padding-right: 70px; }
        .pb-70-res		{ padding-bottom: 70px; }
        .pl-70-res		{ padding-left: 70px; }
        
        .pt-80-res		{ padding-top: 80px; }
        .pr-80-res		{ padding-right: 80px; }
        .pb-80-res		{ padding-bottom: 80px; }
        .pl-80-res		{ padding-left: 80px; }
        
        .pt-90-res		{ padding-top: 90px; }
        .pr-90-res		{ padding-right: 90px; }
        .pb-90-res		{ padding-bottom: 90px; }
        .pl-90-res		{ padding-left: 90px; }
        
        .pt-100-res		{ padding-top: 100px; }
        .pr-100-res		{ padding-right: 100px; }
        .pb-100-res		{ padding-bottom: 100px; }
        .pl-100-res		{ padding-left: 100px; }
        
        .pt-20-pc		{ padding-top: 20px; }
        .pr-20-pc		{ padding-right: 20px; }
        .pb-20-pc		{ padding-bottom: 20px; }
        .pl-20-pc		{ padding-left: 20px; }
        
        .pt-25-pc		{ padding-top: 25px; }
        .pr-25-pc		{ padding-right: 25px; }
        .pb-25-pc		{ padding-bottom: 25px; }
        .pl-25-pc		{ padding-left: 25px; }
        
        .pt-30-pc		{ padding-top: 30px; }
        .pr-30-pc		{ padding-right: 30px; }
        .pb-30-pc		{ padding-bottom: 30px; }
        .pl-30-pc		{ padding-left: 30px; }
        
        .pt-40-pc		{ padding-top: 40px; }
        .pr-40-pc		{ padding-right: 40px; }
        .pb-40-pc		{ padding-bottom: 40px; }
        .pl-40-pc		{ padding-left: 40px; }
        
        .pt-50-pc		{ padding-top: 50px; }
        .pr-50-pc		{ padding-right: 50px; }
        .pb-50-pc		{ padding-bottom: 50px; }
        .pl-50-pc		{ padding-left: 50px; }
        
        .pt-60-pc		{ padding-top: 60px; }
        .pr-60-pc		{ padding-right: 60px; }
        .pb-60-pc		{ padding-bottom: 60px; }
        .pl-60-pc		{ padding-left: 60px; }
        
        .pt-70-pc		{ padding-top: 70px; }
        .pr-70-pc		{ padding-right: 70px; }
        .pb-70-pc		{ padding-bottom: 70px; }
        .pl-70-pc		{ padding-left: 70px; }
        
        .pt-80-pc		{ padding-top: 80px; }
        .pr-80-pc		{ padding-right: 80px; }
        .pb-80-pc		{ padding-bottom: 80px; }
        .pl-80-pc		{ padding-left: 80px; }
        
        .pt-90-pc		{ padding-top: 90px; }
        .pr-90-pc		{ padding-right: 90px; }
        .pb-90-pc		{ padding-bottom: 90px; }
        .pl-90-pc		{ padding-left: 90px; }
        
        .pt-100-pc		{ padding-top: 100px; }
        .pr-100-pc		{ padding-right: 100px; }
        .pb-100-pc		{ padding-bottom: 100px; }
        .pl-100-pc		{ padding-left: 100px; }
      }
      @media (max-width: 767px) {
        .pa-10-res		{ padding: 5px; }
        .pa-20-res		{ padding: 10px; }
        .pa-30-res10	{ padding: 10px; }
        .pa-30-res20	{ padding: 20px; }
        .pa-1030-res  { padding: 10px 15px; }
        .pa-4050-res  { padding: 10px 15px; }
        
        .pt-25-res		{ padding-top: 15px; }
        .pr-25-res		{ padding-right: 15px; }
        .pb-25-res		{ padding-bottom: 15px; }
        .pl-25-res		{ padding-left: 15px; }
        
        .pt-30-res		{ padding-top: 20px; }
        .pr-30-res		{ padding-right: 20px; }
        .pb-30-res		{ padding-bottom: 20px; }
        .pl-30-res		{ padding-left: 20px; }
        
        .pt-40-res		{ padding-top: 20px; }
        .pr-40-res		{ padding-right: 20px; }
        .pb-40-res		{ padding-bottom: 20px; }
        .pl-40-res		{ padding-left: 20px; }
        
        .pt-50-res		{ padding-top: 20px; }
        .pr-50-res		{ padding-right: 20px; }
        .pb-50-res		{ padding-bottom: 20px; }
        .pl-50-res		{ padding-left: 20px; }
        
        .pt-60-res		{ padding-top: 25px; }
        .pr-60-res		{ padding-right: 25px; }
        .pb-60-res		{ padding-bottom: 25px; }
        .pl-60-res		{ padding-left: 25px; }
        
        .pt-70-res		{ padding-top: 30px; }
        .pr-70-res		{ padding-right: 30px; }
        .pb-70-res		{ padding-bottom: 30px; }
        .pl-70-res		{ padding-left: 30px; }
        
        .pt-80-res		{ padding-top: 30px; }
        .pr-80-res		{ padding-right: 30px; }
        .pb-80-res		{ padding-bottom: 30px; }
        .pl-80-res		{ padding-left: 30px; }
        
        .pt-90-res		{ padding-top: 40px; }
        .pr-90-res		{ padding-right: 40px; }
        .pb-90-res		{ padding-bottom: 40px; }
        .pl-90-res		{ padding-left: 40px; }
        
        .pt-100-res		{ padding-top: 60px; }
        .pr-100-res		{ padding-right: 60px; }
        .pb-100-res		{ padding-bottom: 60px; }
        .pl-100-res		{ padding-left: 60px; }
        
        .pt-10-sp		{ padding-top: 10px; }
        .pr-10-sp		{ padding-right: 10px; }
        .pb-10-sp		{ padding-bottom: 10px; }
        .pl-10-sp		{ padding-left: 10px; }
        
        .pt-20-sp		{ padding-top: 20px; }
        .pr-20-sp		{ padding-right: 20px; }
        .pb-20-sp		{ padding-bottom: 20px; }
        .pl-20-sp		{ padding-left: 20px; }
        
        .pt-25-sp		{ padding-top: 25px; }
        .pr-25-sp		{ padding-right: 25px; }
        .pb-25-sp		{ padding-bottom: 25px; }
        .pl-25-sp		{ padding-left: 25px; }
        
        .pt-30-sp		{ padding-top: 30px; }
        .pr-30-sp		{ padding-right: 30px; }
        .pb-30-sp		{ padding-bottom: 30px; }
        .pl-30-sp		{ padding-left: 30px; }
        
        .pt-40-sp		{ padding-top: 40px; }
        .pr-40-sp		{ padding-right: 40px; }
        .pb-40-sp		{ padding-bottom: 40px; }
        .pl-40-sp		{ padding-left: 40px; }
        
        .pt-50-sp		{ padding-top: 50px; }
        .pr-50-sp		{ padding-right: 50px; }
        .pb-50-sp		{ padding-bottom: 50px; }
        .pl-50-sp		{ padding-left: 50px; }
        
        .pt-60-sp		{ padding-top: 60px; }
        .pr-60-sp  	{ padding-right: 60px; }
        .pb-60-sp		{ padding-bottom: 60px; }
        .pl-60-sp		{ padding-left: 60px; }
        
        .pt-70-sp		{ padding-top: 70px; }
        .pr-70-sp		{ padding-right: 70px; }
        .pb-70-sp		{ padding-bottom: 70px; }
        .pl-70-sp		{ padding-left: 70px; }
        
        .pt-80-sp		{ padding-top: 80px; }
        .pr-80-sp		{ padding-right: 80px; }
        .pb-80-sp		{ padding-bottom: 80px; }
        .pl-80-sp		{ padding-left: 80px; }
        
        .pt-90-sp		{ padding-top: 90px; }
        .pr-90-sp		{ padding-right: 90px; }
        .pb-90-sp		{ padding-bottom: 90px; }
        .pl-90-sp		{ padding-left: 90px; }
        
        .pt-100-sp		{ padding-top: 100px; }
        .pr-100-sp		{ padding-right: 100px; }
        .pb-100-sp		{ padding-bottom: 100px; }
        .pl-100-sp		{ padding-left: 100px; }
      }



	/* Negative margin*/
		.nmt-5 {   margin-top:    -5px !important;}
		.nmr-5 {   margin-right:  -5px !important;}
		.nmb-5 {   margin-bottom: -5px !important;}
		.nml-5 {   margin-left:   -5px !important;}
			 
		.nmt-10 {   margin-top:    -10px !important;}
		.nmr-10 {   margin-right:  -10px !important;}
		.nmb-10 {   margin-bottom: -10px !important;}
		.nml-10 {   margin-left:   -10px !important;}
		
		.nmt-15 {   margin-top:    -15px !important;}
		.nmr-15 {   margin-right:  -15px !important;}
		.nmb-15 {   margin-bottom: -15px !important;}
		.nml-15 {   margin-left:   -15px !important;}
		
		.nmt-20 {   margin-top:    -20px !important;}
		.nmr-20 {   margin-right:  -20px !important;}
		.nmb-20 {   margin-bottom: -20px !important;}
		.nml-20 {   margin-left:   -20px !important;}
		
		.nmt-25 {   margin-top:    -25px !important;}
		.nmr-25 {   margin-right:  -25px !important;}
		.nmb-25 {   margin-bottom: -25px !important;}
		.nml-25 {   margin-left:   -25px !important;}



/*	width
===================================================== */

  .w-100p   { width: 100%; }
  .w-90p   { width: 90%; }
  .w-30p   { width: 30%; }
  .w-25p   { width: 25%; }

  .w-90p-res   { width: 90%; }
  .w-80p-res   { width: 80%; }
  .w-70p-res   { width: 70%; }
  .w-60p-res   { width: 60%; }
  .w-50p-res   { width: 50%; }
  .w-48p-res   { width: 48%; }
  .w-40p-res   { width: 40%; }
  .w-32p-res   { width: 32%; }
  .w-30p-res   { width: 30%; }
  .w-25p-res   { width: 25%; }
  .w-24p-res   { width: 24%; }
  .w-20p-res   { width: 20%; }
  .w-10p-res   { width: 10%; }

  .w-m1300 { max-width: 1300px; }
  .w-m800  { max-width: 800px; }
  .w-m700  { max-width: 700px; }
  .w-m600  { max-width: 600px; }
  .w-m480  { max-width: 480px; }
  .w-m320  { max-width: 320px; }
  .w-m240  { max-width: 240px; }
  .w-m190  { max-width: 190px; }

  @media print, screen and (min-width: 768px) {
  }
  @media (max-width: 767px) {
  .w-90p-res,
  .w-80p-res,
  .w-70p-res,
  .w-60p-res,
  .w-50p-res,
  .w-48p-res,
  .w-40p-res,
  .w-32p-res,
  .w-30p-res,
  .w-25p-res,
  .w-24p-res,
  .w-20p-res,
  .w-24p-res   { width: 100%; }
  }




/*	Border radius
===================================================== */

	.br-4 {
		-webkit-border-radius: 4px;
			 -moz-border-radius: 4px;
						border-radius: 4px;
				-ms-border-radius: 4px;
	}

	.br-6 {
		-webkit-border-radius: 6px;
			 -moz-border-radius: 6px;
						border-radius: 6px;
				-ms-border-radius: 6px;
	}
	
	.br-8 {
		-webkit-border-radius: 8px;
			 -moz-border-radius: 8px;
						border-radius: 8px;
				-ms-border-radius: 8px;
	}
	
	.br-12 {
		-webkit-border-radius: 12px;
			 -moz-border-radius: 12px;
						border-radius: 12px;
				-ms-border-radius: 12px;
	}
	
	.br-16 {
		-webkit-border-radius: 16px;
			 -moz-border-radius: 16px;
						border-radius: 16px;
				-ms-border-radius: 16px;
	}
	
	.br-maru {
		-webkit-border-radius: 9999px;
			 -moz-border-radius: 9999px;
						border-radius: 9999px;
				-ms-border-radius: 9999px;
	}



/*	 text color
===================================================== */

	.text-blue      	{ color: var(--cs-blue); }
	.text-blue-light 	{ color: var(--cs-blue-light); }
	.text-blue-dark  	{ color: var(--cs-blue-dark); }
	.text-navy      	{ color: var(--cs-navy); }
	.text-purple      { color: var(--cs-purple); }
	.text-pink      	{ color: var(--cs-pink); }
	.text-pink-light  { color: var(--cs-pink-light); }
	.text-red      	  { color: var(--cs-red); }
	.text-red-light 	{ color: var(--cs-red-light); }
	.text-red-dark  	{ color: var(--cs-red-dark); }
	.text-orange      { color: var(--cs-orange); }
	.text-yellow      { color: var(--cs-yellow); }
	.text-green      	{ color: var(--cs-green); }
	.text-green-light { color: var(--cs-green-light); }
	.text-brown      	{ color: var(--cs-brown); }
	.text-brown-light	{ color: var(--cs-brown-light); }
	.text-brown-dark 	{ color: var(--cs-brown-dark); }
	.text-black      	{ color: var(--cs-black); }
	.text-blue      	{ color: var(--cs-blue); }
	.text-white      	{ color: var(--cs-white); }
	.text-gray      	{ color: var(--cs-gray); }
	.text-gray-light  { color: var(--cs-gray-light); }
	.text-gray-dark   { color: var(--cs-gray-dark); }
	.text-color01     { color: var(--cs-color01); }
	.text-color02     { color: var(--cs-color02); }
	.text-color03     { color: var(--cs-color03); }
	.text-color04     { color: var(--cs-color04); }
	.text-color05     { color: var(--cs-color05); }
	.text-color06     { color: var(--cs-color06); }
	.text-color07     { color: var(--cs-color07); }
	.text-color08     { color: var(--cs-color08); }
	.text-color09     { color: var(--cs-color09); }
	.text-color10     { color: var(--cs-color10); }


/*	 text shadow
===================================================== */

  .text-shadow__black {
    text-shadow:
      3px 3px 10px rgba(0, 0, 0, 0.3),
      -3px 3px 10px rgba(0, 0, 0, 0.3),
      3px -3px 10px rgba(0, 0, 0, 0.3),
      -3px -3px 10px rgba(0, 0, 0, 0.3),
      0px 3px 10px rgba(0, 0, 0, 0.3),
      -3px 0px 10px rgba(0, 0, 0, 0.3),
      0px -3px 10px rgba(0, 0, 0, 0.3),
      -3px 0px 10px rgba(0, 0, 0, 0.3);
    }

  .text-shadow__white {
    text-shadow:
      3px 3px 10px rgba(255, 255, 255, 0.3),
      -3px 3px 10px rgba(255, 255, 255, 0.3),
      3px -3px 10px rgba(255, 255, 255, 0.3),
      -3px -3px 10px rgba(255, 255, 255, 0.3),
      0px 3px 10px rgba(255, 255, 255, 0.3),
      -3px 0px 10px rgba(255, 255, 255, 0.3),
      0px -3px 10px rgba(255, 255, 255, 0.3),
      -3px 0px 10px rgba(255, 255, 255, 0.3);
    }

  .text-shadow__color01 {
    text-shadow:
      3px 3px 10px rgba(var(--cs-shadowcolor01) 0.3),
      -3px 3px 10px rgba(var(--cs-shadowcolor01) 0.3),
      3px -3px 10px rgba(var(--cs-shadowcolor01) 0.3),
      -3px -3px 10px rgba(var(--cs-shadowcolor01) 0.3),
      0px 3px 10px rgba(var(--cs-shadowcolor01) 0.3),
      -3px 0px 10px rgba(var(--cs-shadowcolor01) 0.3),
      0px -3px 10px rgba(var(--cs-shadowcolor01) 0.3),
      -3px 0px 10px rgba(var(--cs-shadowcolor01) 0.3);
    }

  .text-shadow__color02 {
    text-shadow:
      3px 3px 10px rgba(var(--cs-shadowcolor02) 0.3),
      -3px 3px 10px rgba(var(--cs-shadowcolor02) 0.3),
      3px -3px 10px rgba(var(--cs-shadowcolor02) 0.3),
      -3px -3px 10px rgba(var(--cs-shadowcolor02) 0.3),
      0px 3px 10px rgba(var(--cs-shadowcolor02) 0.3),
      -3px 0px 10px rgba(var(--cs-shadowcolor02) 0.3),
      0px -3px 10px rgba(var(--cs-shadowcolor02) 0.3),
      -3px 0px 10px rgba(var(--cs-shadowcolor02) 0.3);
    }

  .text-shadow__color03 {
    text-shadow:
      3px 3px 10px rgba(var(--cs-shadowcolor03) 0.3),
      -3px 3px 10px rgba(var(--cs-shadowcolor03) 0.3),
      3px -3px 10px rgba(var(--cs-shadowcolor03) 0.3),
      -3px -3px 10px rgba(var(--cs-shadowcolor03) 0.3),
      0px 3px 10px rgba(var(--cs-shadowcolor03) 0.3),
      -3px 0px 10px rgba(var(--cs-shadowcolor03) 0.3),
      0px -3px 10px rgba(var(--cs-shadowcolor03) 0.3),
      -3px 0px 10px rgba(var(--cs-shadowcolor03) 0.3);
    }


/*	 background
===================================================== */

	.back-blue      	{ background-color: var(--cs-blue); }
	.back-blue-light 	{ background-color: var(--cs-blue-light); }
	.back-blue-dark  	{ background-color: var(--cs-blue-dark); }
	.back-navy      	{ background-color: var(--cs-navy); }
	.back-purple      { background-color: var(--cs-purple); }
	.back-pink      	{ background-color: var(--cs-pink); }
	.back-pink-light  { background-color: var(--cs-pink-light); }
	.back-red      	  { background-color: var(--cs-red); }
	.back-red-light 	{ background-color: var(--cs-red-light); }
	.back-red-dark  	{ background-color: var(--cs-red-dark); }
	.back-orange      { background-color: var(--cs-orange); }
	.back-yellow      { background-color: var(--cs-yellow); }
	.back-green      	{ background-color: var(--cs-green); }
	.back-green-light { background-color: var(--cs-green-light); }
	.back-brown      	{ background-color: var(--cs-brown); }
	.back-brown-light { background-color: var(--cs-brown-light); }
	.back-brown-dark  { background-color: var(--cs-brown-dark); }
	.back-black      	{ background-color: var(--cs-black); }
	.back-blue      	{ background-color: var(--cs-blue); }
	.back-white      	{ background-color: var(--cs-white); }
	.back-gray      	{ background-color: var(--cs-gray); }
	.back-gray-light  { background-color: var(--cs-gray-light); }
	.back-gray-dark   { background-color: var(--cs-gray-dark); }
	.back-color01     { background-color: var(--cs-color01); }
	.back-color02     { background-color: var(--cs-color02); }
	.back-color03     { background-color: var(--cs-color03); }
	.back-color04     { background-color: var(--cs-color04); }
	.back-color05     { background-color: var(--cs-color05); }
	.back-color06     { background-color: var(--cs-color06); }
	.back-color07     { background-color: var(--cs-color07); }
	.back-color08     { background-color: var(--cs-color08); }
	.back-color09     { background-color: var(--cs-color09); }
	.back-color10     { background-color: var(--cs-color10); }





/*	 border
===================================================== */

  .border-all       { border: 1px solid var(--cs-bordercolor); }
  .border-top       { border-top: 1px solid var(--cs-bordercolor); }
  .border-right     { border-right: 1px solid var(--cs-bordercolor); }
  .border-bottom    { border-bottom: 1px solid var(--cs-bordercolor); }
  .border-left      { border-left: 1px solid var(--cs-bordercolor); }


  /* border style*/
  .border-solid     { border-style: solid; }
  .border-dotted     { border-style: dotted; }
  .border-top-dotted { border-top-style: dotted; }
  .border-right-dotted     { border-right-style: dotted; }
  .border-bottom-dotted    { border-bottom-style: dotted; }
  .border-left-dotted      { border-left-style: dotted; }

  .border-dashed { border-style: dashed; }
  .border-top-dashed { border-top-style: dashed; }
  .border-right-dashed     { border-right-style: dashed; }
  .border-bottom-dashed    { border-bottom-style: dashed; }
  .border-left-dashed      { border-left-style: dashed; }

  .border-double { border-style: double; }
  .border-top-double { border-top-style: double; }
  .border-right-double     { border-right-style: double; }
  .border-bottom-double    { border-bottom-style: double; }
  .border-left-double      { border-left-style: double; }

  
  /* color */
  .border-blue        { border-color: var(--cs-blue)!important; }
	.border-blue-light 	{ border-color: var(--cs-blue-light)!important; }
	.border-blue-dark  	{ border-color: var(--cs-blue-dark)!important; }
	.border-navy      	{ border-color: var(--cs-navy)!important; }
	.border-purple      { border-color: var(--cs-purple)!important; }
	.border-pink      	{ border-color: var(--cs-pink)!important; }
	.border-pink-light  { border-color: var(--cs-pink-light)!important; }
	.border-red      	  { border-color: var(--cs-red)!important; }
	.border-red-light 	{ border-color: var(--cs-red-light)!important; }
	.border-red-dark  	{ border-color: var(--cs-red-dark)!important; }
	.border-orange      { border-color: var(--cs-orange)!important; }
	.border-yellow      { border-color: var(--cs-yellow)!important; }
	.border-green      	{ border-color: var(--cs-green)!important; }
	.border-green-light { border-color: var(--cs-green-light)!important; }
	.border-brown      	{ border-color: var(--cs-brown)!important; }
	.border-brown-light { border-color: var(--cs-brown-light)!important; }
	.border-brown-dark  { border-color: var(--cs-brown-dark)!important; }
	.border-black      	{ border-color: var(--cs-black)!important; }
	.border-blue      	{ border-color: var(--cs-blue)!important; }
	.border-white      	{ border-color: var(--cs-white)!important; }
	.border-gray      	{ border-color: var(--cs-gray)!important; }
	.border-gray-light  { border-color: var(--cs-gray-light)!important; }
	.border-gray-dark   { border-color: var(--cs-gray-dark)!important; }
	.border-color01     { border-color: var(--cs-color01)!important; }
	.border-color02     { border-color: var(--cs-color02)!important; }
	.border-color03     { border-color: var(--cs-color03)!important; }
	.border-color04     { border-color: var(--cs-color04)!important; }
	.border-color05     { border-color: var(--cs-color05)!important; }
	.border-color06     { border-color: var(--cs-color06)!important; }
	.border-color07     { border-color: var(--cs-color07)!important; }
	.border-color08     { border-color: var(--cs-color08)!important; }
	.border-color09     { border-color: var(--cs-color09)!important; }
	.border-color10     { border-color: var(--cs-color10)!important; }

  /* border width*/
  .border-w1   { border-width: 1px; }
  .border-w2   { border-width: 2px; }
  .border-w3   { border-width: 3px; }
  .border-w5   { border-width: 5px; }
  .border-w6   { border-width: 6px; }
  .border-w8   { border-width: 8px; }
  .border-w10  { border-width: 10px; }
    @media print, screen and (min-width: 768px) {
      .border-w5-res   { border-width: 5px; }
      .border-w6-res   { border-width: 6px; }
      .border-w8-res   { border-width: 8px; }
      .border-w10-res  { border-width: 10px; }
    }
    @media (max-width: 767px) {
      .border-w5-res   { border-width: 3px; }
      .border-w6-res   { border-width: 3px; }
      .border-w8-res   { border-width: 4px; }
      .border-w10-res  { border-width: 5px; }
    }







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

	Fadein
	
======================================================================== */

	/* ページ読み込み時にフェードイン */
		body {
			animation: fadeIn 1s ease 0s 1 normal;
			-webkit-animation: fadeIn 1s ease 0s 1 normal;
			}
		@keyframes fadeIn {
			0% {opacity: 0}
			100% {opacity: 1}
			}
		@-webkit-keyframes fadeIn {
			0% {opacity: 0}
			100% {opacity: 1}
			}