@charset "UTF-8";
@media screen and (max-width: 767px) { #contents .headSection { padding-bottom: 10vw; }
  #contents .headSection .innerBlock { text-align: center; }
  #contents .headSection * { float: none !important; width: auto !important; }
  #contents .headSection .ttl p.productsLogo { font-size: 22px; font-size: 2.93vw; padding: 0; }
  #contents .headSection .ttl h1 { font-size: 5vw; }
  #contents .headSection .aside { padding: 0; }
  #contents .headSection .aside .guide li.purchase { width: 45% !important; padding-left: 0; }
  #contents .headSection .aside .guide li.purchase a { padding: 0; padding-top: 0; background: none; }
  #contents .headSection .aside .guide li.purchase a img { width: 100% !important; height: auto; }
  #contents .headSection .aside .guide li.purchase a:hover img { visibility: visible; } }

#main_contents { font-family: "Noto Sans JP", sans-serif; -webkit-font-feature-settings: "palt"; font-feature-settings: "palt"; }

#main_contents svg { width: 100%; height: auto; }

#mainvisual { position: relative; width: 100%; height: 589px; overflow: hidden; }

@media screen and (max-width: 767px) { #mainvisual { height: 105.6vw; } }

#mainvisual .mainBg { position: absolute; top: 0; left: 0; width: 100%; height: 100%; background: url(/products/homeprojector/column/images/visual.jpg) center top repeat-y; background-size: 100% auto; background-attachment: fixed; }

@media screen and (max-width: 767px) { #mainvisual .mainBg { background: url(/products/homeprojector/column/images/visual_sp.jpg) center top repeat-y; background-size: 100% auto; background-attachment: scroll; height: 105.6vw; }
  #mainvisual .mainBg.fixed { position: fixed; } }

#mainvisual h2.title { position: absolute; top: 75px; left: 50%; margin: 0 0 0 26.15385vw; padding: 8px 0 0; -webkit-box-sizing: border-box; box-sizing: border-box; width: 168px; height: 364px; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; -webkit-box-orient: horizontal; -webkit-box-direction: reverse; -ms-flex-flow: row-reverse; flex-flow: row-reverse; }

@media screen and (max-width: 767px) { #mainvisual h2.title { top: 3.46667vw; margin: 0 0 0 -42vw; padding: 0.66667vw 0 0; width: 83.73333vw; height: 31.06667vw; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-flow: inherit; flex-flow: inherit; -ms-flex-wrap: wrap; flex-wrap: wrap; } }

#mainvisual h2.title .bg { position: absolute; top: 0; left: 0; width: 100%; height: 100%; background: url(/products/homeprojector/column/images/visual_title_bg.svg) center top no-repeat; background-size: cover; }

@media screen and (max-width: 767px) { #mainvisual h2.title .bg { background: url(/products/homeprojector/column/images/visual_title_bg_sp.svg) center top no-repeat; background-size: cover; } }

#mainvisual h2.title span.text { display: block; color: #fff; font-family: "Noto Serif JP", serif; font-size: 44px; font-weight: bold; line-height: 1; letter-spacing: -0.01em; -webkit-writing-mode: vertical-rl; -ms-writing-mode: tb-rl; writing-mode: vertical-rl; text-orientation: upright; white-space: nowrap; }

@media screen and (max-width: 767px) { #mainvisual h2.title span.text { -webkit-writing-mode: inherit; -ms-writing-mode: inherit; writing-mode: inherit; text-orientation: inherit; font-size: 10.4vw; letter-spacing: -0.1em; text-align: center; -webkit-font-feature-settings: "palt"; font-feature-settings: "palt"; }
  #mainvisual h2.title span.text span.nallow { text-indent: -0.2em; display: inline-block; } }

#mainvisual h2.title span.text.large { font-size: 72px; margin: 0 5px 0 0; }

@media screen and (max-width: 767px) { #mainvisual h2.title span.text.large { font-size: 16.53333vw; margin: -1.6vw 0 0; } }

#mainvisual h2.title span.subtitle { position: absolute; top: 84px; left: 200px; -webkit-transform: rotate(90deg); transform: rotate(90deg); -webkit-transform-origin: left top; transform-origin: left top; color: #fff; font-family: "游明朝体", "Yu Mincho", YuMincho, "ヒラギノ明朝 Pro", "Hiragino Mincho Pro", "MS P明朝", "MS PMincho", serif; font-size: 15px; font-weight: 500; line-height: 1; letter-spacing: 0.03em; white-space: nowrap; }

@media screen and (max-width: 767px) { #mainvisual h2.title span.subtitle { top: 35.46667vw; left: 85.33333vw; font-size: 3.46667vw; } }

#mainvisual p.lead { position: absolute; top: 110px; left: 50%; margin: 0 0 0 -29.53846vw; color: #fff; font-size: 17px; font-weight: bold; -webkit-writing-mode: vertical-rl; -ms-writing-mode: tb-rl; writing-mode: vertical-rl; text-orientation: upright; line-height: 1.7; }

@media screen and (max-width: 767px) { #mainvisual p.lead { top: auto; bottom: 5.06667vw; left: 0; margin: 0 auto 0; width: 100%; text-align: center; font-size: 4vw; line-height: 1.5; -webkit-writing-mode: inherit; -ms-writing-mode: inherit; writing-mode: inherit; text-orientation: inherit; } }

@media screen and (min-width: 768px) and (max-width: 1180px) { #mainvisual { height: 49.91525vw; }
  #mainvisual h2.title { top: 6.35593vw; }
  #mainvisual p.lead { top: 9.32203vw; } }

#nav { position: fixed; top: 50%; left: 12px; z-index: 2; margin: -179px 0 0; width: 34px; height: 337px; background: url(/products/homeprojector/column/images/nav_bg.svg) left top no-repeat; background-size: 6px 337px; opacity: 0; -webkit-transition: opacity 0.3s linear; transition: opacity 0.3s linear; }

@media screen and (max-width: 767px) { #nav { display: none; } }

#nav.view { opacity: 1; }

#nav ul.list { margin: 0 0 0 12px; padding: 21px 0 0; }

#nav ul.list li { margin-bottom: 26px; line-height: 1; }

.ie #nav ul.list li { margin-bottom: 27px; }

#nav ul.list li a { color: #c9c9c9; font-size: 13px; font-weight: bold; line-height: 1; -webkit-transition: color 0.2s linear; transition: color 0.2s linear; }

@media screen and (min-width: 768px) { #nav ul.list li a:hover { color: #000; text-decoration: none; } }

#nav ul.list li.curr a { color: #000; }

#index_btn { display: none; }

@media screen and (max-width: 767px) { #index_btn { display: block; position: fixed; top: 1.33333vw; right: 1.33333vw; width: 21.46667vw; height: 8.4vw; border: #006cff 2px solid; border-radius: 0.66667vw; background: #fff; font-size: 4.26667vw; font-weight: bold; text-align: center; line-height: 8.4vw; z-index: 5; opacity: 0; pointer-events: none; -webkit-transition: opacity 0.3s linear; transition: opacity 0.3s linear; }
  #index_btn.view { opacity: 1; pointer-events: visible; } }

#index_area { background: #eee; width: 100%; padding: 58px 0 78px; }

@media screen and (max-width: 767px) { #index_area { padding: 6.4vw 0 6.66667vw; } }

.indexInner { position: relative; background: #fff; width: 886px; padding: 40px 0 52px; margin: 0 auto 0; }

@media screen and (max-width: 767px) { .indexInner { width: 94.66667vw; padding: 5.33333vw 0 6.66667vw; } }

.indexInner .corner { position: absolute; width: 27px; height: 26px; }

@media screen and (max-width: 767px) { .indexInner .corner { width: 3.6vw; height: 3.46667vw; } }

.indexInner .corner.c01 { top: 0; left: 0; }

.indexInner .corner.c02 { top: 0; right: 0; -webkit-transform: scale(-1, 1); transform: scale(-1, 1); }

.indexInner .corner.c03 { bottom: 0; right: 0; -webkit-transform: scale(-1, -1); transform: scale(-1, -1); }

.indexInner .corner.c04 { bottom: 0; left: 0; -webkit-transform: scale(1, -1); transform: scale(1, -1); }

.indexInner .corner img { width: 100%; height: auto; }

.indexInner h2.title { text-align: center; color: #1a1a1a; font-size: 20px; font-weight: bold; line-height: 1; }

@media screen and (max-width: 767px) { .indexInner h2.title { font-size: 6.66667vw; } }

.indexInner ul.list { margin: 23px auto 0; width: 544px; border-top: #c9c9c9 1px solid; }

@media screen and (max-width: 767px) { .indexInner ul.list { margin: 4.53333vw auto 0; width: 82.66667vw; } }

.indexInner ul.list li { border-bottom: #c9c9c9 1px solid; }

.indexInner ul.list li a { position: relative; -webkit-box-sizing: border-box; box-sizing: border-box; display: block; width: 100%; height: 100%; padding: 11px 8px; color: #1a1a1a; font-size: 16px; font-weight: bold; line-height: 1; }

@media screen and (max-width: 767px) { .indexInner ul.list li a { padding: 1.73333vw 0; font-size: 2.66667vw; } }

.indexInner ul.list li a::after { content: ''; position: absolute; top: 9px; right: 1px; width: 21px; height: 21px; background: url(/products/homeprojector/column/images/index_ico.svg) no-repeat; background-size: 21px 21px; }

.ie .indexInner ul.list li a::after { background-size: 20px 20px; }

@media screen and (max-width: 767px) { .indexInner ul.list li a::after { top: 2vw; right: 0; width: 2.8vw; height: 2.8vw; background-size: 2.8vw 2.8vw; } }

#popup_index { position: fixed; top: 0; left: -100vw; z-index: 1100; width: 100%; height: 100vh; -webkit-transition: left 0.3s linear; transition: left 0.3s linear; background: rgba(255, 255, 255, 0.95); overflow-y: scroll; font-family: "Noto Sans JP", sans-serif; -webkit-font-feature-settings: "palt"; font-feature-settings: "palt"; }

@media screen and (min-width: 768px) { #popup_index { display: none; } }

#popup_index svg { width: 100%; height: auto; }

#popup_index #index_close { position: absolute; top: 7.06667vw; right: 7.86667vw; width: 10.4vw; opacity: 1; -webkit-transition: opacity 0.3s linear; transition: opacity 0.3s linear; }

#popup_index #index_close img { width: 100%; height: auto; }

#popup_index.is_open { left: 0; /* #index_close { position: fixed; opacity: 1; } */ }

#popup_index .indexInner { position: relative; top: 50%; left: 0; margin: -30.66667vw auto 0; width: 100%; height: 61.33333vw; padding: 0; background: transparent; }

@media (orientation: landscape) { #popup_index .indexInner { top: 0; margin: 0 auto 0; padding: 20vw 0; } }

.article { background: #eee; width: 100%; }

.article .titleArea { position: relative; margin: 0 auto 0; padding: 8px 0; }

@media screen and (max-width: 767px) { .article .titleArea { padding: 1.06667vw 0; } }

.article .titleArea::before { content: ''; position: absolute; top: 0; left: 50%; width: 96.486%; margin: 0 0 0 -48.243%; height: 1px; background: #c9c9c9; }

@media screen and (max-width: 767px) { .article .titleArea::before { left: 0; width: 100%; margin: 0; } }

.article .titleArea::after { content: ''; position: absolute; bottom: 0; left: 50%; width: 96.486%; margin: 0 0 0 -48.243%; height: 1px; -webkit-box-sizing: border-box; box-sizing: border-box; background: #c9c9c9; }

@media screen and (max-width: 767px) { .article .titleArea::after { left: 0; width: 100%; margin: 0; } }

.article .titleArea .titleAreaInner { position: relative; padding: 50px 0 84px; color: #fff; text-align: center; overflow: hidden; }

@media screen and (max-width: 767px) { .article .titleArea .titleAreaInner { text-align: left; padding: 4.13333vw 0 11.6vw; } }

.article .titleArea .titleAreaInner::after { content: ''; position: absolute; top: 0; left: 0; width: 100%; height: 100%; background-color: rgba(0, 0, 0, 0.5); }

.article .titleArea .titleAreaInner .scrollBg { position: absolute; top: 0; left: 0; width: 100%; height: 100%; background-image: url(/products/homeprojector/column/images/title_bg.jpg); background-position: center top; background-size: 100% auto; background-attachment: fixed; }

@media screen and (max-width: 767px) { .article .titleArea .titleAreaInner .scrollBg { background-image: url(/products/homeprojector/column/images/title_bg_sp.jpg); background-position: center -55.73333vw; background-attachment: scroll; padding: 3.73333vw 0 11.73333vw; }
  .article .titleArea .titleAreaInner .scrollBg.fixed { position: fixed; } }

.article .titleArea .titleAreaInner .no { position: relative; z-index: 2; display: inline-block; font-family: "游明朝体", "Yu Mincho", YuMincho, "ヒラギノ明朝 Pro", "Hiragino Mincho Pro", "MS P明朝", "MS PMincho", serif; font-size: 33px; font-weight: 500; line-height: 1; padding: 0 0 10px 5px; border-bottom: #fff 5px solid; }

.ie .article .titleArea .titleAreaInner .no { padding: 0 0 2px 5px; }

@media screen and (max-width: 767px) { .article .titleArea .titleAreaInner .no { margin: 0 0 0 2.66667vw; font-size: 4.4vw; padding: 0 0 1.33333vw 0.66667vw; border-bottom: #fff 0.66667vw solid; } }

.article .titleArea .titleAreaInner h2.title { position: relative; z-index: 2; margin: 34px auto 0; font-size: 52px; font-weight: bold; line-height: 1; }

@media screen and (max-width: 767px) { .article .titleArea .titleAreaInner h2.title { margin: 0 auto 0; font-size: 6vw; text-align: center; line-height: 1.2; } }

.article .titleArea .titleAreaInner.line2 { padding: 50px 0 34px; }

@media screen and (max-width: 767px) { .article .titleArea .titleAreaInner.line2 { padding: 4.13333vw 0 11.6vw; } }

.article .titleArea .titleAreaInner.line2 h2.title { line-height: 1.2; }

.article .contentArea { position: relative; padding: 38px 0 88px; margin: 0 auto 0; width: 1134px; min-width: 900px; color: #1a1a1a; }

@media screen and (min-width: 768px) and (max-width: 1180px) { .article .contentArea { width: 96.10169vw; } }

@media screen and (max-width: 767px) { .article .contentArea { width: 92vw; min-width: auto; } }

.article .contentArea img { width: 100%; height: auto; }

.article .contentArea img.iPop01 { width: 15px; height: auto; }

.article .contentArea p.lead { width: 764px; margin: 0 auto 0; font-size: 17px; font-weight: 500; line-height: 1.9; letter-spacing: 0.03em; }

@media screen and (max-width: 767px) { .article .contentArea p.lead { width: 100%; font-size: 3.33333vw; line-height: 1.6; } }

.article .contentArea .image { margin: 30px auto 0; width: 650px; }

@media screen and (max-width: 767px) { .article .contentArea .image { margin: 6vw auto 0; width: 100%; } }

.article .contentArea .image p.caption { margin: 13px 0 0 -55px; width: 760px; font-size: 14px; font-weight: 500; line-height: 1.6; }

@media screen and (max-width: 767px) { .article .contentArea .image p.caption { margin: 2.4vw auto 0; width: 100%; font-size: 2.53333vw; line-height: 1.3; } }

.article .contentArea .image p.caption.tCenter { text-align: center; }

@media screen and (max-width: 767px) { .article .contentArea .image p.caption.tCenter { text-align: left; } }

.article .contentArea h3.title { margin: 48px auto 0; font-size: 32px; font-weight: bold; line-height: 1.4; text-align: center; }

@media screen and (max-width: 767px) { .article .contentArea h3.title { margin: 8vw auto 0; font-size: 4.26667vw; } }

.article .contentArea h3.title small { font-size: 25px; }

@media screen and (max-width: 767px) { .article .contentArea h3.title small { font-size: 3.33333vw; } }

.article .contentArea p.text { width: 764px; margin: 38px auto 0; font-size: 17px; font-weight: 500; line-height: 1.9; letter-spacing: 0.03em; }

@media screen and (max-width: 767px) { .article .contentArea p.text { width: 100%; margin: 5.06667vw auto 0; font-size: 3.33333vw; line-height: 1.6; } }

.article .contentArea .noteBox { width: 826px; margin: 23px auto 0; padding: 22px 0; -webkit-box-sizing: border-box; box-sizing: border-box; background: #fff; border: #989698 1px solid; text-align: center; font-size: 20px; font-weight: bold; line-height: 1.6; }

@media screen and (max-width: 767px) { .article .contentArea .noteBox { width: 100%; margin: 3.2vw auto 0; padding: 3.2vw 0; font-size: 3.73333vw; } }

.article .contentArea .noteBox.small { width: 478px; }

@media screen and (max-width: 767px) { .article .contentArea .noteBox.small { width: 100%; } }

.article .contentArea .noteBox.products { padding: 18px 0; line-height: 1; }

@media screen and (max-width: 767px) { .article .contentArea .noteBox.products { width: 84vw; margin: 10.66667vw auto 0; padding: 2.13333vw 0; } }

.article .contentArea .button { margin: 26px auto 0; }

@media screen and (max-width: 767px) { .article .contentArea .button { margin: 4.53333vw auto 0; } }

.article .contentArea .button .buttonInner { text-align: center; }

.article .contentArea .button a { display: inline-block; min-width: 574px; height: 100%; background-color: #006cff; border-radius: 8px; -webkit-box-shadow: 0 6px 0 #002e9d; box-shadow: 0 6px 0 #002e9d; color: #ffffff; text-align: center; font-size: 17px; font-weight: bold; line-height: 2; text-decoration: none; padding: 16px 64px; -webkit-box-sizing: border-box; box-sizing: border-box; -webkit-transition: opacity 0.3s linear, -webkit-transform 0.1s linear, -webkit-box-shadow 0.1s linear; transition: opacity 0.3s linear, -webkit-transform 0.1s linear, -webkit-box-shadow 0.1s linear; transition: opacity 0.3s linear, transform 0.1s linear, box-shadow 0.1s linear; transition: opacity 0.3s linear, transform 0.1s linear, box-shadow 0.1s linear, -webkit-transform 0.1s linear, -webkit-box-shadow 0.1s linear; }

@media screen and (min-width: 768px) { .article .contentArea .button a:hover { opacity: 0.6; -webkit-box-shadow: none; box-shadow: none; -webkit-transform: translate3d(0, 6px, 0); transform: translate3d(0, 6px, 0); } }

@media screen and (max-width: 767px) { .article .contentArea .button a { min-width: auto; width: 84vw; border-radius: 1.06667vw; -webkit-box-shadow: 0 0.8vw 0 #002e9d; box-shadow: 0 0.8vw 0 #002e9d; font-size: 3.33333vw; line-height: 1.9; padding: 4vw 0; } }

.article .contentArea .button a span.text { border-bottom: #fff 1px solid; }

.article .contentArea .button.small a { min-width: 242px; width: 242px; padding: 16px 0; }

@media screen and (max-width: 767px) { .article .contentArea .button.small a { min-width: auto; width: 48.53333vw; padding: 4vw 0; } }

.article .contentArea .button.medium a { min-width: 330px; padding: 16px 40px; }

@media screen and (max-width: 767px) { .article .contentArea .button.medium a { min-width: auto; width: 84vw; padding: 4vw 0; } }

.article .contentArea .fbox { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; margin: 12px auto 0; }

@media screen and (max-width: 767px) { .article .contentArea .fbox { margin: 1.6vw auto 2.66667vw; } }

.article .contentArea .fbox .button { margin: 0 9px; }

@media screen and (max-width: 767px) { .article .contentArea .fbox .button { margin: 0 1.2vw; }
  .article .contentArea .fbox .button a { min-width: auto; width: 41.06667vw; padding: 4vw 0; } }

.article .contentArea .box { width: 100%; margin: 60px auto 0; display: -webkit-box; display: -ms-flexbox; display: flex; }

@media screen and (max-width: 767px) { .article .contentArea .box { -ms-flex-wrap: wrap; flex-wrap: wrap; } }

.article .contentArea .box .image { width: 545px; margin: 8px 35px 0 0; }

@media screen and (max-width: 767px) { .article .contentArea .box .image { width: 100%; margin: 0 auto 0; } }

.article .contentArea .box .image p.caption { margin: 3px 0 0; width: 100%; }

@media screen and (max-width: 767px) { .article .contentArea .box .image p.caption { margin: 2.4vw auto 0; } }

.article .contentArea .box .image p.caption.pt { margin: 24px 0 0; }

@media screen and (max-width: 767px) { .article .contentArea .box .image p.caption.pt { margin: 2.66667vw auto 0; } }

.article .contentArea .box p.text { width: 550px; margin: 0 auto 0; }

@media screen and (max-width: 767px) { .article .contentArea .box p.text { width: 100%; margin: 2.93333vw auto 0; } }

.article .contentArea .box.reverse { -webkit-box-orient: horizontal; -webkit-box-direction: reverse; -ms-flex-direction: row-reverse; flex-direction: row-reverse; -webkit-box-pack: end; -ms-flex-pack: end; justify-content: flex-end; }

@media screen and (max-width: 767px) { .article .contentArea .box.reverse { -webkit-box-orient: inherit; -webkit-box-direction: inherit; -ms-flex-direction: inherit; flex-direction: inherit; -webkit-box-pack: start; -ms-flex-pack: start; justify-content: flex-start; } }

.article .contentArea .box.reverse .image { width: 545px; margin: 8px 0 0 35px; }

@media screen and (max-width: 767px) { .article .contentArea .box.reverse .image { width: 100%; margin: 0 auto 0; } }

.article .contentArea .box.reverse p.text { width: 550px; margin: 0 auto 0; }

@media screen and (max-width: 767px) { .article .contentArea .box.reverse p.text { width: 100%; margin: 2.93333vw auto 0; } }

#profile_area { padding: 52px 0 82px; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; color: #1a1a1a; }

@media screen and (max-width: 767px) { #profile_area { -ms-flex-wrap: wrap; flex-wrap: wrap; width: 92vw; margin: 0 auto 0; padding: 8.8vw 0 9.33333vw; } }

#profile_area .imageArea { width: 240px; }

@media screen and (max-width: 767px) { #profile_area .imageArea { width: 100%; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; -webkit-box-align: center; -ms-flex-align: center; align-items: center; } }

#profile_area .imageArea .image { width: 150px; }

@media screen and (max-width: 767px) { #profile_area .imageArea .image { width: 33.86667vw; margin: 0 5.86667vw 0 0; } }

#profile_area .imageArea .image img { width: 100%; height: auto; }

#profile_area .imageArea p.position { margin: 38px 0 0; font-size: 17px; font-weight: bold; line-height: 1; }

@media screen and (max-width: 767px) { #profile_area .imageArea p.position { margin: 0; font-size: 3.6vw; } }

#profile_area .imageArea p.name { margin: 22px 0 0; font-size: 32px; font-weight: bold; line-height: 1; }

@media screen and (max-width: 767px) { #profile_area .imageArea p.name { margin: 4.26667vw 0 0; font-size: 6.66667vw; } }

#profile_area .imageArea p.name.en { margin: 16px 0 0; font-size: 14px; }

@media screen and (max-width: 767px) { #profile_area .imageArea p.name.en { margin: 3.2vw 0 0; font-size: 2.93333vw; } }

#profile_area .textArea { width: 490px; }

@media screen and (max-width: 767px) { #profile_area .textArea { width: 100%; margin: 4.53333vw auto 0; } }

#profile_area .textArea p.text { font-size: 17px; font-weight: 500; line-height: 1.95; letter-spacing: 0.03em; }

@media screen and (max-width: 767px) { #profile_area .textArea p.text { font-size: 3.33333vw; line-height: 1.6; letter-spacing: 0; } }
/*# sourceMappingURL=index.css.map */