@charset "UTF-8";
/* リセットCSS
----------------------------------------*/
h1, h2, h3, h4, h5, h6, div, p, ul, li, dl, dt, dd, table, tr, td, img {
  margin: 0;
  border: 0;
  padding: 0;
}

/* コンテナ
----------------------------------------*/
div#container {
  width: 980px;
  font-family: "游ゴシック体", YuGothic, "游ゴシック", "Yu Gothic", "メイリオ", sans-serif;
  font-weight: 500;
  margin: 0 0 10%;
}

/* タイトル
----------------------------------------*/
#container h1 {
  border-bottom: 1px solid #333333;
  font-size: 1.8em;
  margin: 0 0 15px;
  padding-bottom: 3px;
}

div.title-banner {
  width: 100%;
  margin: 0 auto;
}

.title-banner img {
  width: 100%;
}

/* new */
p.read {
  padding: 0 6%;
  margin: 0 0 9%;
  line-height: 1.5;
  font-size: 1.05em;
}

#main-content {
  width: 980px;
  margin: 0 auto;
}

#main-content h2 {
  text-align: center;
  font-size: 2.5em;
  font-weight: normal;
  color: #174CA8;
  margin: 4% 0 3%;
}

span.kakko {
  letter-spacing: -0.5em;
}

.title-banner {
  margin: 30px 0px 25px 0px;
}

.title-banner.kyugyo {
  margin: 10px 0px 25px 0px;
}

p.title-text {
  margin-bottom: 36px;
}

p.title-text span.top {
  display: block;
  color: #004DA2;
  font-size: 1.5em;
  margin-bottom: 10px;
}

p.title-text span.bottom {
  font-size: 0.95em;
  line-height: 1.4;
}

/* 様々な製品を、実際に見てお試しいただけます */
div#otameshi {
  background-color: #D4EEFB;
  padding: 5% 0% 4% 6%;
  margin-bottom: 11.5%;
}

div#otameshi img.op {
  margin: 0 auto 2.5%;
  display: block;
}

div#otameshi span {
  text-align: center;
  display: block;
  font-size: 2em;
  color: #164BAB;
  margin: 0 0 3%;
}

div#otameshi ul li {
  width: 30.5%;
  float: left;
}

div#otameshi ul li:nth-child(2) {
  padding: 0 1.8%;
}

div#otameshi ul li p.ot-title {
  color: #0A4DB6;
  font-size: 1.19em;
  text-align: center;
  padding: 5.8% 0 3.5%;
  font-weight: bold;
}

div#otameshi ul li p.ot-note {
  font-size: 0.9em;
  line-height: 1.6;
}

div#otameshi ul li p.ot-note span {
  font-size: 0.87em;
  line-height: 1.6;
  color: #379ADD;
  display: block;
  margin-top: 1%;
  text-indent: -1em;
  margin-left: 1em;
  text-align: left;
}

/* ビーコン */
.beacon-area {
  margin: 0 auto;
  width: 846px;
  position: relative;
}

.beacon-area a {
  color: #333333;
  text-decoration: none;
}

.beacon-area a:hover span {
  opacity: 0.6;
}

.beacon-area span {
  position: absolute;
  top: 107px;
  left: 51px;
  line-height: 1.7em;
}

/* 画像切替 */
div#change-img {
  width: 640px;
  margin: 0 auto;
}

.main li.item2, .main li.item3, .main li.item4, .main li.item5, .main li.item6, .main li.item7, .main li.item8, .main li.item9, .main li.item10, .main li.item11, .main li.item12, .main li.item13, .main li.item14 {
  display: none;
}

div#change-img div#thum-img {
  padding: 17px 0 0 10px;
}

div#change-img div#thum-img ul li {
  float: left;
  margin: 0 10px 10px 0;
  cursor: pointer;
  position: relative;
}

div#change-img div#thum-img ul li img:hover {
  opacity: 0.6;
}

div#change-img div#thum-img ul li#now span {
  position: absolute;
  top: 1px;
  left: 1px;
  display: block;
  width: 78px;
  height: 48px;
  background-color: #555555;
  opacity: 0.7;
}

div#change-img div#thum-img ul li#now img {
  border: 1px solid #FF0000;
  width: 78px;
  height: 48px;
}

div#change-img div#thum-img ul li#now {
  pointer-events: none;
}

div#change-img p.att {
  font-size: 0.9em;
  text-align: right;
}

div#change-img p.att span {
  color: #004DA2;
  font-size: 1.05em;
  vertical-align: middle;
}

div#change-img p.att span.att-text {
  color: #333333;
  font-size: 0.9em;
}

/* 住所 */
div#adress-area {
  border: 1px solid #989898;
  padding: 25px 20px;
  margin: 36px 0 20px;
}

div#adress-area div#adress, div#adress-area div#adress-img, div#adress-area div#adress-map {
  float: left;
}

div#adress-area div#adress {
  width: 225px;
}

div#adress-area div#adress-img {
  width: 202px;
  padding-left: 30px;
}

div#adress-area div#adress-map {
  width: 370px;
  padding-left: 10px;
}

div#adress-area div#adress dl dt {
  color: #004DA2;
  font-size: 1.15em;
  border-bottom: 1px solid #004DA2;
  margin-bottom: 5px;
  padding-bottom: 2px;
}

div#adress-area div#adress dl dd {
  font-size: 0.95em;
  line-height: 1.4;
  margin-bottom: 35px;
}

div#adress-area div#adress dl dd span {
  display: block;
  text-indent: -1em;
  margin-left: 1em;
}

div#adress-area .map {
  margin: 50px 0 0 0;
  text-align: center;
}

div#adress-area .map .text {
  margin: 10px 0 0 0;
  line-height: 1.4em;
}

div.otoiawase-link {
  text-align: center;
  margin-top: 6.5%;
}

#kyugyo {
  border: 2px solid #FF0000;
  border-radius: 0.5em;
  padding: 0.8em 0 0.8em 0;
  margin: 20px 0 40px;
}

#kyugyo.ire {
  border: none;
  border-radius: 0.5em;
  padding: 0.8em 0 0.8em 0;
  margin: 20px 0 40px;
}

#kyugyo p {
  font-size: 1em;
  color: #FF0000;
  text-align: left;
  margin: 0;
  line-height: 1.55;
}

#kyugyo.ire p.tana {
  font-size: 1.05em;
  color: blue;
  text-align: center;
  padding: 0.3em 0 0.3em 0;
}

#kyugyo p.tana {
  text-align: center;
  font-size: 1em;
  padding: 0.3em 0 0.3em 0;
}

#kyugyo p.coro {
  padding: 0 0 0 10em;
}

#kyugyo.end {
  padding: 0.8em 0 0.8em 2.2em;
}

#kyugyo.end-sub {
  padding: 0.8em 0 0.8em 6em;
}

#kyugyo p.cent {
  text-align: center;
}

#kyugyo p span {
  color: #FF0000;
  font-weight: bold;
}

#kyugyo p span.ind {
  display: block;
  color: #FF0000;
  font-weight: normal;
  text-indent: -1em;
  margin: 0 0 0 1em;
}

#event p {
  font-family: "游ゴシック",sans-serif;
  margin: 5% 0 5%;
  text-align: center;
  font-size: 2.5em;
  color: #FF0000;
  border: 2px solid #FF0000;
  border-radius: 0.35em;
  padding: 2.2% 0 2%;
  font-weight: bold;
}

/* 各展示場へのリンク */
div#link h3 {
  text-align: center;
  font-size: 1.8em;
  border-bottom: 1px solid #CCC;
  padding: 0 0 1%;
  margin: 0 0 3%;
}

div.link-inner {
  padding: 0 30px;
}

div.link-inner div.link-box {
  display: block;
}

div.link-inner a:hover img {
  opacity: 1 !important;
}

div.link-inner div.link-box {
  display: block;
  width: 390px;
  padding: 28px 22px 25px;
  color: #333333;
}

div.link-inner div.link-box:nth-of-type(1) {
  float: left;
  border: 2px solid #308BFF;
}

div.link-inner div.link-box:nth-of-type(1) span.link-title {
  color: #308BFF;
}

div.link-inner div.link-box:nth-of-type(2) {
  float: right;
  border: 2px solid #01A479;
}

div.link-inner div.link-box:nth-of-type(2) span.link-title {
  color: #01A479;
}

div.link-inner a:hover {
  opacity: 0.6;
  text-decoration: none;
  color: #333333;
}

div.link-inner span.link-title {
  display: block;
  font-size: 1.7em;
  font-weight: bold;
  letter-spacing: -0.02em;
  margin: 0 0 3.5%;
}

div.link-inner span.link-title span {
  display: inline-block;
  font-size: 0.6em;
  margin: 0 0 0 2%;
  vertical-align: 4px;
  background-color: #FF0000;
  color: #FFFFFF;
  font-weight: bold;
  padding: 1.4% 1% 0.8%;
  letter-spacing: -0.02em;
}

div.link-inner span.detail-outer span.note {
  display: block;
  font-size: 0.97em;
  line-height: 1.4;
  margin: 5% 0;
  padding: 0 0.3%;
}

div.link-inner span.detail-outer ul {
  padding: 10px 8px;
  margin: 3% 0 0;
}

div.link-inner span.detail-outer li {
  text-indent: -6em;
  font-size: 0.9em;
  line-height: 1.4;
  margin: 0 0 2% 6em;
}

a.btn {
  display: block;
  width: 75%;
  margin: 0 auto;
  padding: 5%;
  text-align: center;
  border: 1px solid #AAAAAA;
  border-radius: 3em;
  background-color: #FFFF01;
  font-size: 1.2em;
  font-weight: bold;
}

a.btn:hover {
  cursor: pointer;
}

a.btn img {
  vertical-align: 2px;
  margin: 0 0.5em 0 0;
}

div.movie {
  text-align: center;
  margin: 50px 0 65px;
}

.display-list {
  margin: 25px 0 60px;
  text-align: center;
}

.display-list a.twit {
  display: inline-block;
  margin: 2.5% 0 0;
}

.display-list span {
  color: #009BEC;
  display: block;
  margin: 1% 0 0;
  font-size: 1.05em;
}

/* clfx */
.clfx:after {
  content: "";
  clear: both;
  height: 0;
  display: block;
  visibility: hidden;
}