@charset "shift-jis";
/* 6. Easy Navi Layout
---------------------------------------------------------*/
#page-content-easynavi .page-content-title { border-top: 6px solid #f6bb42; }
#page-content-easynavi .page-content-title:after { content: ''; display: block; clear: both; }
#page-content-easynavi .page-content-title h3 { float: left; height: 80px; margin-top: 15px; }
#page-content-easynavi .page-content-title h6 { float: right; margin-top: 20px; }

#easynavi-content-first-choice, #easynavi-content-second-choice-a, #easynavi-content-second-choice-b, #easynavi-content-second-choice-c, #easynavi-content-second-choice-d { background-color: white; border-left: 1px solid #e5e5e5; border-right: 1px solid #e5e5e5; border-bottom: 1px solid #e5e5e5; }

#easynavi-content-first-choice { display: block; }

#easynavi-content-second-choice-a, #easynavi-content-second-choice-b, #easynavi-content-second-choice-c, #easynavi-content-second-choice-d { display: none; }

#easynavi-content-first-choice .easynavi-content-choice-container { padding-top: 40px; padding-bottom: 50px; }
#easynavi-content-first-choice .easynavi-content-choice-container li { margin-left: 10px; margin-right: 10px; }

#easynavi-content-second-choice-a .easynavi-content-choice-container, #easynavi-content-second-choice-b .easynavi-content-choice-container, #easynavi-content-second-choice-c .easynavi-content-choice-container, #easynavi-content-second-choice-d .easynavi-content-choice-container { padding-top: 60px; padding-bottom: 70px; }
#easynavi-content-second-choice-a .easynavi-content-choice-container li, #easynavi-content-second-choice-b .easynavi-content-choice-container li, #easynavi-content-second-choice-c .easynavi-content-choice-container li, #easynavi-content-second-choice-d .easynavi-content-choice-container li { margin-left: 30px; margin-right: 30px; }

.easynavi-content-choice-title h4 { color: #3f3f3f; font-size: 22px; line-height: 62px; height: 60px; padding-left: 20px; background-color: #dfdfdf; }
.easynavi-content-choice-title .arrow-down { border-top-color: #dfdfdf; }

.easynavi-content-choice-container ul { text-align: center; }
.easynavi-content-choice-container li { display: inline-block; margin-bottom: 25px; }
.easynavi-content-choice-container a { display: block; color: #3f3f3f; font-size: 21px; font-weight: bold; letter-spacing: -0.045em; border-radius: 8px; background-color: #a5d11e; background-repeat: no-repeat; box-shadow: 0px 4px 0px #8eb711; -webkit-box-shadow: 0px 4px 0px #8eb711; }
.easynavi-content-choice-container a:hover { opacity: 0.6; text-decoration: none; }

.first-choice-button { width: 420px; height: 120px; line-height: 120px; text-indent: 120px; background-position: 15px center; }

.second-choice-button { width: 310px; height: 220px; line-height: 350px; text-align: center; background-position: center 35px; }

.choice-1a-button { background-image: url(../imgs/easynavi/icon_choice1a.png); }

.choice-1b-button { background-image: url(../imgs/easynavi/icon_choice1b.png); }

.choice-1c-button { background-image: url(../imgs/easynavi/icon_choice1c.png); }

.choice-1d-button { background-image: url(../imgs/easynavi/icon_choice1d.png); }

.choice-2a-button { background-image: url(../imgs/easynavi/icon_choice_headband.png); }

.choice-2b-button { background-image: url(../imgs/easynavi/icon_choice_innerear.png); }

#easynavi-content-control { margin-top: 70px; }
#easynavi-content-control a { margin-left: auto; margin-right: auto; }

#easynavi-content-first-control { display: block; }

#easynavi-content-second-control { display: none; }

@media only screen and (max-width: 740px) { #page-content-easynavi .page-content-title { border-top: 4px solid #f6bb42; }
  #page-content-easynavi .page-content-title h3 { float: none; height: auto; margin-top: 15px; }
  #page-content-easynavi .page-content-title h3 img { width: 65%; height: auto; }
  #page-content-easynavi .page-content-title h6 { float: none; margin-top: 2px; }
  #page-content-easynavi .page-content-title h6 img { width: 60%; height: auto; }
  #easynavi-content { margin-top: 15px; }
  #easynavi-content-first-choice, #easynavi-content-second-choice-a, #easynavi-content-second-choice-b, #easynavi-content-second-choice-c, #easynavi-content-second-choice-d { border-left: none; border-right: none; }
  #easynavi-content-first-choice .easynavi-content-choice-container { padding-top: 15px; padding-bottom: 15px; }
  #easynavi-content-first-choice .easynavi-content-choice-container li { margin-left: 0px; margin-right: 0px; padding-left: 10px; padding-right: 10px; }
  #easynavi-content-second-choice-a .easynavi-content-choice-container, #easynavi-content-second-choice-b .easynavi-content-choice-container, #easynavi-content-second-choice-c .easynavi-content-choice-container, #easynavi-content-second-choice-d .easynavi-content-choice-container { padding-top: 25px; padding-bottom: 25px; }
  #easynavi-content-second-choice-a .easynavi-content-choice-container li, #easynavi-content-second-choice-b .easynavi-content-choice-container li, #easynavi-content-second-choice-c .easynavi-content-choice-container li, #easynavi-content-second-choice-d .easynavi-content-choice-container li { margin-left: 0px; margin-right: 0px; padding-left: 10px; padding-right: 10px; }
  .easynavi-content-choice-title h4 { font-size: 14px; font-weight: bold; line-height: 40px; height: 40px; padding-left: 10px; }
  .easynavi-content-choice-container li { display: block; margin-bottom: 15px; }
  .easynavi-content-choice-container a { font-size: 16px; font-weight: bold; box-shadow: 0px 3px 0px #8eb711; -webkit-box-shadow: 0px 3px 0px #8eb711; }
  .easynavi-content-choice-container a:hover { opacity: 0.6; text-decoration: none; }
  .first-choice-button { width: 100%; height: 60px; line-height: 60px; text-indent: 65px; background-position: 10px center; background-size: 45px 45px; }
  .second-choice-button { width: 100%; height: 60px; line-height: 60px; text-align: left; text-indent: 65px; background-position: 10px center; background-size: 45px 45px; }
  #easynavi-content-control { margin-top: 30px; }
  #easynavi-content-control a { margin-left: auto; margin-right: auto; }
  #easynavi-content-first-control { display: block; padding-left: 10px; padding-right: 10px; }
  #easynavi-content-second-control { display: none; padding-left: 10px; padding-right: 10px; } }
#easynavi-content-product { background-color: white; border-left: 1px solid #e5e5e5; border-right: 1px solid #e5e5e5; border-bottom: 1px solid #e5e5e5; }

.easynavi-content-product-title h4 { color: #3f3f3f; font-size: 22px; font-weight: bold; line-height: 62px; height: 60px; padding-left: 20px; background-color: #dfdfdf; }
.easynavi-content-product-title .arrow-down { border-top-color: #dfdfdf; }

.easynavi-content-product-lineup .underline { border-bottom: 1px solid #e5e5e5; }
.easynavi-content-product-lineup .odd-item { border-right: 1px solid #e5e5e5; }

.easynavi-content-product-lineup-title { width: 100%; height: 56px; margin-top: 15px; background-color: #a5d11e; }
.easynavi-content-product-lineup-title h5 { color: white; font-size: 22px; font-weight: bold; line-height: 58px; text-align: center; }

.easynavi-content-product-lineup-items ul:after { content: ''; display: block; clear: both; }
.easynavi-content-product-lineup-items li { float: left; width: 459px; height: 220px; box-sizing: border-box; -webkit-box-sizing: border-box; }
.easynavi-content-product-lineup-items li:after { content: ''; display: block; clear: both; }

.lineup-item-image { float: left; width: 190px; margin-left: 15px; margin-right: 15px; padding-top: 10px; }

.lineup-item-data { float: left; width: 210px; padding-top: 20px; }

.lineup-item-data-name { font-size: 20px; }
.lineup-item-data-name h7 { font-size: 20px; }

.lineup-item-data-copy { height: 45px; margin-top: 5px; }
.lineup-item-data-copy p { color: #5b5b5b; }

.lineup-item-data-link { margin-top: 10px; }
.lineup-item-data-link a { margin-top: 5px; }

#easynavi-content-product-links { margin-top: 70px; }
#easynavi-content-product-links a { width: 450px; float: right; }
#easynavi-content-product-links a:first-child { float: left; }

@media only screen and (max-width: 740px) { #easynavi-content-product { border-left: none; border-right: none; }
  .easynavi-content-product-title h4 { font-size: 12px; font-weight: bold; letter-spacing: -0.025em; line-height: 40px; height: 40px; padding-left: 10px; }
  .easynavi-content-product-lineup .odd-item { border-right: none; }
  .easynavi-content-product-lineup-title { height: 40px; }
  .easynavi-content-product-lineup-title h5 { font-size: 15px; line-height: 40px; }
  .easynavi-content-product-lineup-items li { float: none; width: 100%; height: auto; box-sizing: border-box; -webkit-box-sizing: border-box; border-bottom: 1px solid #e5e5e5; display: box; display: -webkit-box; padding-bottom: 10px; }
  .easynavi-content-product-lineup-items li:last-child { border-bottom: none; }
  .easynavi-content-product-lineup-items .lineup-item-data-copy { min-height: 40px; }
  .lineup-item-image { float: none; width: 48%; margin-left: 0px; margin-right: 0px; }
  .lineup-item-image img { width: 100%; height: auto; }
  .lineup-item-data { float: none; width: 52%; padding-right: 10px; }
  .lineup-item-data-name h7 { font-size: 18px; }
  .lineup-item-data-copy { height: auto; }
  .lineup-item-data-copy p { font-size: 13px; line-height: 1.4em; }
  .lineup-item-data-link { margin-top: 5px; }
  #easynavi-content-product-links { margin-top: 30px; padding-left: 10px; padding-right: 10px; }
  #easynavi-content-product-links a { width: 100%; float: none; }
  #easynavi-content-product-links a:first-child { float: none; margin-bottom: 15px; } }
.easynavi-content-lineup-all-title { text-align: center; padding-bottom: 10px; }

.easynavi-content-lineup-list { margin-top: 40px; }
.easynavi-content-lineup-list .odd-item { border-left: 1px solid #e5e5e5; }
.easynavi-content-lineup-list.first-list { margin-top: 0px; }

.easynavi-content-lineup-title { width: 100%; height: 56px; margin-top: 10px; background-color: #f6bb42; }
.easynavi-content-lineup-title h5 { display: inline-block; color: #3f3f3f; font-size: 22px; font-weight: bold; line-height: 58px; text-indent: 20px; vertical-align: top; }
.easynavi-content-lineup-title span { display: inline-block; height: 26px; color: #3f3f3f; font-size: 13px; font-weight: bold; line-height: 28px; text-indent: 0px; margin-top: 15px; margin-left: 20px; padding-left: 10px; padding-right: 10px; background-color: white; }

.easynavi-content-lineup-items ul:after { content: ''; display: block; clear: both; }
.easynavi-content-lineup-items li { float: left; width: 460px; height: 270px; border-right: 1px solid #e5e5e5; border-bottom: 1px solid #e5e5e5; background-color: white; }
.easynavi-content-lineup-items li:after { content: ''; display: block; clear: both; }
.easynavi-content-lineup-items .lineup-item-image { width: 205px; text-align: center; }
.easynavi-content-lineup-items .lineup-item-data { padding-top: 50px; }
.easynavi-content-lineup-items .lineup-item-data-name { font-size: 20px; }
.easynavi-content-lineup-items .lineup-item-data-name h7 { font-size: 20px; }
.easynavi-content-lineup-items .lineup-item-data-copy { height: auto; margin-top: 10px; }
.easynavi-content-lineup-items .lineup-item-data-copy p { color: #5b5b5b; }
.easynavi-content-lineup-items .lineup-item-data-type { display: inline-block; height: 24px; margin-top: 10px; color: #3f3f3f; font-size: 12px; line-height: 24px; text-align: center; padding-left: 10px; padding-right: 10px; border: 1px solid #f6bb42; }
.easynavi-content-lineup-items .lineup-item-data-type p { color: #5b5b5b; }
.easynavi-content-lineup-items .lineup-item-data-link { clear: left; margin-top: 10px; }
.easynavi-content-lineup-items .lineup-item-data-link:after { content: ''; display: block; clear: both; }
.easynavi-content-lineup-items .lineup-item-data-link a { float: right; width: 200px; margin-top: 10px; margin-right: 25px; margin-left: 0px; }
.easynavi-content-lineup-items .lineup-item-data-link a:first-child { float: left; margin-right: 0px; margin-left: 25px; }

@media only screen and (max-width: 740px) { .easynavi-content-lineup-all-title { padding-bottom: 2px; }
  .easynavi-content-lineup-all-title img { width: 50%; height: auto; }
  .easynavi-content-lineup-list { margin-top: 20px; }
  .easynavi-content-lineup-list .odd-item { border-left: none; }
  .easynavi-content-lineup-list.first-list { margin-top: 0px; }
  .easynavi-content-lineup-title { height: 40px; }
  .easynavi-content-lineup-title:after { content: ''; display: block; clear: both; }
  .easynavi-content-lineup-title h5 { display: block; float: left; font-size: 14px; line-height: 40px; letter-spacing: -0.055em; text-indent: 10px; vertical-align: top; }
  .easynavi-content-lineup-title span { display: block; float: right; height: 22px; font-size: 10px; line-height: 22px; margin-top: 9px; margin-left: 0px; margin-right: 8px; padding-left: 5px; padding-right: 5px; }
  .easynavi-content-lineup-items li { float: none; width: 100%; height: auto; border-right: none; background-color: white; padding-bottom: 10px; }
  .easynavi-content-lineup-items .lineup-item-image { float: left; width: 50%; text-align: center; }
  .easynavi-content-lineup-items .lineup-item-data { float: right; width: 48%; padding-top: 20px; }
  .easynavi-content-lineup-items .lineup-item-data-name h7 { font-size: 18px; }
  .easynavi-content-lineup-items .lineup-item-data-copy { height: auto; min-height: auto; }
  .easynavi-content-lineup-items .lineup-item-data-copy p { font-size: 13px; line-height: 1.4em; }
  .easynavi-content-lineup-items .lineup-item-data-type { display: inline-block; height: 20px; margin-top: 10px; color: #3f3f3f; font-size: 10px; line-height: 20px; text-align: center; padding-left: 5px; padding-right: 5px; border: 1px solid #f6bb42; }
  .easynavi-content-lineup-items .lineup-item-data-type p { color: #5b5b5b; }
  .easynavi-content-lineup-items .lineup-item-data-link { clear: left; margin-top: 10px; }
  .easynavi-content-lineup-items .lineup-item-data-link:after { content: ''; display: block; clear: both; }
  .easynavi-content-lineup-items .lineup-item-data-link a { float: right; width: 45%; margin-top: 10px; margin-right: 10px; margin-left: 0px; }
  .easynavi-content-lineup-items .lineup-item-data-link a:first-child { float: left; margin-right: 0px; margin-left: 10px; } }