@charset "UTF-8";
@font-face {
    font-family: 'Optima';
    src: 
		url('fonts/Optima.woff2') format('woff2'),
         url('fonts/Optima.woff') format('woff'),
         url('fonts/Optima.ttf') format('truetype');
}

body {
  margin: 0;
  padding: 0;
  font-family: "游ゴシック体", "Yu Gothic", YuGothic, "ヒラギノ角ゴシック Pro", "Hiragino Kaku Gothic Pro", 'メイリオ' , Meiryo , Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
  text-align: center;
  background-color: #FFF;
  color: #1A1311;
  font-size: 13px; }

section .content,
footer .content {
  width: 1152px;
  margin: 0 auto; }

aside nav {
  width: 1152px;
  margin: 0 auto; }

h1,
h2,
h3 {
  margin: 0;
  padding: 0;
  font-size: 13px;
  font-weight: normal;
  line-height: 1.5em; }

p, figure {
  margin: 0;
  padding: 0; }
  
  ul {
	  list-style-type:none;
	  margin:0;
	  padding:0;
	  }

a {
  color: #1A1311;
  text-decoration:none;
  transition: .35s; }
  a img {
    transition: .35s;
    border: none; }
  a:hover {
    text-decoration: underline; }
    a:hover img {
      opacity: 0.7;
      filter: alpha(opacity=70); }

a.morebtn {
  letter-spacing: .3em;
  border: 1px solid #EBEBEB;
  padding: 5px 45px 5px 25px;
  margin-top: 30px;
  text-decoration: none; }
  a.morebtn::after {
    content: url("../images/news_plus.webp");
    position: absolute;
    top: 6px;
    right: 20px; }
  a.morebtn:hover {
    opacity: 0.7;
    filter: alpha(opacity=70); }

img {
  vertical-align: bottom;
  line-height: 0; }

.optima {
	letter-spacing:0.1em;
  font-family: 'Optima',  "游ゴシック体", "Yu Gothic", YuGothic, "ヒラギノ角ゴシック Pro", "Hiragino Kaku Gothic Pro", 'メイリオ' , Meiryo , Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif; }

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

.flex {
  display: -js-flex;
  display: -webkit-flex;
  display: -moz-flex;
  display: -ms-flex;
  display: -o-flex;
  display: flex; }

.fs11 {
  font-size: 11px; }

.fs12 {
  font-size: 12px; }

.fs13 {
  font-size: 13px; }

.fs14 {
  font-size: 14px; }

.fs15 {
  font-size: 15px; }

.fs16 {
  font-size: 16px; }

.fs17 {
  font-size: 17px; }

.fs18 {
  font-size: 18px; }

.fs19 {
  font-size: 19px; }

.fs20 {
  font-size: 20px; }

.fs21 {
  font-size: 21px; }

.fs22 {
  font-size: 22px; }

.fs23 {
  font-size: 23px; }

.fs24 {
  font-size: 24px; }

.fs27 {
  font-size: 27px; }

.fs30 {
  font-size: 30px; }

.ft-wb {
  font-weight: bold; }

.txt-al {
  text-align: left; }

.txt-ac {
  text-align: center; }

.txt-ar {
  text-align: right; }

.lts-03 {
  letter-spacing: 0.3em; }

.underline {
  text-decoration: underline; }

.mt6 {
  margin-top: 6px; }

.mt10 {
  margin-top: 10px; }

.mt30 {
  margin-top: 30px; }

.mt120 {
  margin-top: 120px; }

.mb10 {
  margin-bottom: 10px; }

.mb35 {
  margin-bottom: 35px; }

.mb55 {
  margin-bottom: 55px; }

.pos-a {
  position: absolute; }

.pos-r {
  position: relative; }

.pos-f {
  position: fixed; }

.dsp_blk {
  display: block; }

.dsp_iblk {
  display: inline-block; }

.logo_wrapper {
	width:100%;
	text-align:center;
	width:480px;
}


header {
  padding-bottom: 50px; }
  header .news {
    border-bottom: 1px solid #D4D5D5; }
    header .news .content {
      letter-spacing: .4em; }
      header .news .content .title {
        width: 12%;
        padding: 15px 0 10px 0; }
      header .news .content .excerpt {
        width: 70%;
        padding: 15px 0 10px 0; }
        header .news .content .excerpt span.date {
          margin-right: 20px; }
      header .news .content a.readmore {
        width: 13%;
        padding-top: 17px;
        box-sizing: border-box;
        text-decoration: none; }
        header .news .content a.readmore::after {
          content: url(../images/news_plus.webp);
          position: absolute;
          top: 17px;
          right: 0; }
        header .news .content a.readmore:hover {
          opacity: 0.7;
          filter: alpah(opacty=70); }
  header .logoline .content {
	  justify-content: center;
    padding: 10px 0 0 0; }
    header .logoline .content .searchbox {
      width: 310px;
      padding-top: 20px; }
      header .logoline .content .searchbox input[type="text"] {
        border: 1px solid #D4D5D5;
        padding: 8px;
        width: 280px;
        letter-spacing: .22em; }
      header .logoline .content .searchbox input[type="submit"] {
        top: 2px;
        right: 8px;
        background-color: none;
        background-image: url("../images/search_btn.webp");
        text-indent: -9999px;
        border: 0;
        width: 30px;
        height: 27px;
        cursor: pointer; }
header .logoline .content h1 {
	width:100%;
	text-align:center;
	width:480px;
}
header .logoline .content h1 img {
	max-width:100%;
	position:relative;
	left:35px;
}
  header .salespoint {
    padding-bottom: 40px; }
  header aside nav {
    border-top: 1px solid #D4D5D5;
    border-bottom: 1px solid #D4D5D5; }
    header aside nav ul li a {
      display: block; }
    header aside nav ul li .dropnav {
      display: none;
      background-color: rgba(250, 227, 222, 0.9);
      padding: 60px;
      top: 102px;
	  z-index:1000; }
      header aside nav ul li .dropnav::after {
        content: "";
        clear: both; }
      header aside nav ul li .dropnav .floatitem {
        float: left;
        width: 220px; }
      header aside nav ul li .dropnav ul {
        margin: 0;
        padding: 0;
        line-height: 1em;
        list-style: none; }
        header aside nav ul li .dropnav ul li a {
          padding: 8px 0; }
      header aside nav ul li .dropnav .sign {
		line-height:1em;
        padding: 0 0 25px 15px;
        position: relative; }
        header aside nav ul li .dropnav .sign::before {
          content: "-";
          position: absolute;
          left: 0;
          top: 0; }
    header aside nav ul li .item {
      width: 880px; }
    header aside nav ul li .features {
      width: 310px; }
  header aside > nav > ul {
    margin: 0;
    padding: 0;
    list-style: none; }
  header aside > nav > ul > li {
    width: 25%;
    padding: 40px 0;
    box-sizing: border-box;
    transition: .25s; }
    header aside > nav > ul > li:hover {
      text-decoration: underline; }
  header aside > nav > ul > li > a {
    text-decoration: none; }
    header aside > nav > ul > li > a:hover {
      text-decoration: underline; }
  header .fixed {
    position: fixed;
    top: 0;
    left: 0;
    padding-bottom: 0;
    background-color: #FFF;
    width: 100%;
    z-index: 100; }
    header .fixed .logoline {
      padding-bottom: 20px; }
    header .fixed aside > nav > ul > li {
      padding: 5px 0; }
    header .fixed .dropnav {
      top: 32px; }

footer {
	background:#F6F6F6;
	margin-top:100px;
  padding: 30px 0 0 0; }
  footer .flex .flexitem {
    border-left: 1px solid #A6A7A7;
    box-sizing: border-box;
    padding: 30px 0 20px 20px;
    width: 15%;
    position: relative; }
    footer .flex .flexitem p {
      color: #A6A7A7; }
      footer .flex .flexitem p.sign {
		  line-height:1em;
        padding-bottom: 34px; }
        footer .flex .flexitem p.sign:nth-child(3) {
          margin-top: 34px; }
      footer .flex .flexitem p.copy {
        position: absolute;
        bottom: 20px;
        right: 0; }
    footer .flex .flexitem ul {
      margin: 0;
      padding: 0;
      list-style: none;
      word-wrap: break-word; }
      footer .flex .flexitem ul li a {
        color: #A6A7A7;
        display: block;
        padding: 3px 0;
        font-size: 12px; }
        footer .flex .flexitem ul li a:hover {
          color: #1A1311; }
    footer .flex .flexitem:nth-child(-n+5) {
      border-left: none; }

	  
#pagetopButton {
	position:fixed;
	bottom:60px;
	right:20px;
	z-index:100;
	opacity:0;
	transition:opacity 0.5s linear;
	}
#pagetopButton.on {opacity:1;}


/*========================
アニメーション

・css easing
easeOutQuart
cubic-bezier(0.165, 0.84, 0.44, 1);

easeInOutQuart
cubic-bezier(0.77, 0, 0.175, 1);
========================*/

/*スライドイン 左から右*/
.slideRight {
	-webkit-transform:translateX(-30px);
	transform:translateX(-30px);
	opacity:0;
	-webkit-transition:
		-webkit-transform 0.5s cubic-bezier(0.165, 0.84, 0.44, 1),
		opacity 0.5s linear;
	transition:
		transform 0.5s cubic-bezier(0.165, 0.84, 0.44, 1),
		opacity 0.5s linear;
	}
.slideRight.on {
	-webkit-transform:translateX(0px);
	transform:translateX(0px);
	opacity:1;
	}

/*スライドイン 右から左*/
.slideLeft {
	-webkit-transform:translateX(30px);
	transform:translateX(30px);
	opacity:0;
	-webkit-transition:
		-webkit-transform 0.5s cubic-bezier(0.165, 0.84, 0.44, 1),
		opacity 0.5s linear;
	transition:
		transform 0.5s cubic-bezier(0.165, 0.84, 0.44, 1),
		opacity 0.5s linear;
	}
.slideLeft.on {
	-webkit-transform:translateX(0px);
	transform:translateX(0px);
	opacity:1;
	}
	
/*スライドイン 上から下*/
.slideDown {
	-webkit-transform:translateY(-30px);
	transform:translateY(-30px);
	opacity:0;
	-webkit-transition:
		-webkit-transform 0.5s cubic-bezier(0.165, 0.84, 0.44, 1),
		opacity 0.5s linear;
	transition:
		transform 0.5s cubic-bezier(0.165, 0.84, 0.44, 1),
		opacity 0.5s linear;
	z-index:1;
	}
.slideDown.on {
	-webkit-transform:translateY(0px);
	transform:translateY(0px);
	opacity:1;
	}
	
/*スライドイン 下から上*/
.slideUp {
	-webkit-transform:translateY(30px);
	transform:translateY(30px);
	opacity:0;
	-webkit-transition:
		-webkit-transform 0.5s cubic-bezier(0.165, 0.84, 0.44, 1),
		opacity 0.5s linear;
	transition:
		transform 0.5s cubic-bezier(0.165, 0.84, 0.44, 1),
		opacity 0.5s linear;
	z-index:1;
	}
.slideUp.on {
	-webkit-transform:translateY(0px);
	transform:translateY(0px);
	opacity:1;
	}

/*フェードイン*/
.fadeIn {opacity:0;-webkit-transition:opacity 0.5s linear;transition:opacity 0.5s linear;}
.fadeIn.on {opacity:1;}

/*フェードアウト*/
.fadeOut {opacity:1;-webkit-transition:opacity 0.5s linear;transition:opacity 0.5s linear;}
.fadeOut.on {opacity:0;}

/*Youtube*/
.ytArea {
	position:relative;
	padding:30px 0 44%;
	}
.ytArea iframe {
	width:100%;
	height:100%;
	top:0;
	left:0;
	position:absolute;
	}

.fv_search {
    margin-top: 30px;
}
.fv_search form {
    display: flex;
    justify-content: space-between;
    max-width: 450px;
    margin: auto;
    border: #C7C7C7 solid 2px;
    border-radius: 5px;
    overflow: hidden;
}
.fv_search form input[name="keyword"] {
    width: calc(100% - 100px);
    padding: 10px;
    border: none;
    box-sizing: border-box;
}
.fv_search form input[type="submit"] {
    width: 100px;
    background: #DC5F89;
    border: solid 1px #DC5F89;
    color: #fff;
}
.fv_search dl {
    display: flex;
    justify-content: space-between;
    max-width: 400px;
    margin: 15px auto 0;
}
.fv_search dl dt {
    width: 30%;
    min-width: 120px;
    max-width: 120px;
    text-align: left;
}
.fv_search dl dd {
    width: 70%;
    max-width: calc(100% - 120px);
    margin: 0;
}
.fv_search dl dd ul {
    padding: 0;
    margin: 0;
    list-style: none;
    display: flex;
    flex-wrap: wrap;
}
.fv_search dl dd ul li {
    padding: 0 10px;
}
.fv_search dl dd ul li a {
    display: inline-block;
    border-bottom: solid 1px #000;
}
.fv_search dl dd ul li a:hover {
  text-decoration: none;
}