*, ::before, ::after {
                box-sizing: border-box
                }

html {
                line-sizing: normal
                }

body {
                margin: 0
                }

[hidden] {
                display: none
                }

pre {
                white-space: pre-wrap
                }

hr {
                border-style: solid;
                border-width: 1px 0 0;
                color: inherit;
                height: 0;
                overflow: visible
                }

img, svg, video, canvas, audio, iframe, embed, object {
                display: block;
                vertical-align: middle;
                max-width: 100%
                }

audio:not([controls]) {
                display: none
                }

picture {
                display: contents
                }

source {
                display: none
                }

img, svg, video, canvas {
                height: auto
                }

audio {
                width: 100%
                }

img {
                border-style: none
                }

svg {
                overflow: hidden
                }

article, aside, details, figcaption, figure, footer, header, hgroup, main, nav, section {
                display: block
                }

[type='checkbox'], [type='radio'] {
                box-sizing: border-box;
                padding: 0
                }

h1, h2, h3, h4, h5, h6, p {
                margin: 0
                }

picture {
                display: block
                }

ul[class], ol[class] {
                list-style: none;
                padding: 0;
                margin: 0;
                padding-inline-start: 0
                }

a {
                cursor: pointer;
                text-decoration: none;
                color: #555;
                border-bottom: 1px solid #fff
                }

a:hover {
                border-bottom: 1px solid #555
                }

html {
                font-size: 62.5%
                }

body {
                font-family: europa, 'Inter', "游ゴシック Medium", YuGothic, YuGothicM, "Hiragino Kaku Gothic ProN", "メイリオ", Meiryo, sans-serif;
                font-weight: normal;
                font-weight: 400;
                font-size: 1.6rem;
                color: #888;
                line-height: 2em;
                -webkit-text-size-adjust: 100%;
                word-wrap: break-word;
                line-break: strict
                }

h1, h2, h3, h4, h5, h6 {
                font-family: europa, 'Nunito Sans', "游ゴシック Medium", YuGothic, YuGothicM, "Hiragino Kaku Gothic ProN", "メイリオ", Meiryo, sans-serif;
                font-weight: normal;
                line-height: 2em;
                color: #111;
                letter-spacing: 0.05em
                }

h1 .en, h2 .en, h3 .en, h4 .en, h5 .en, h6 .en {
                letter-spacing: 0.1em
                }

.num {
                font-family: europa, 'Inter', "游ゴシック Medium", YuGothic, YuGothicM, "Hiragino Kaku Gothic ProN", "メイリオ", Meiryo, sans-serif;
                font-size: 0.95em
                }

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

.clearfix {
                zoom: 1
                }

body {
                font-size: 1.3rem
                }

.pc {
                display: none
                }

.pa {
                display: none
                }

.sp {
                display: block
                }

.pc_pa {
                display: none
                }

.pa_sp {
                display: block
                }

@media screen and (min-width: 600px) {
body {
                font-size: 1.4rem
                  }
.pc {
                display: none
                  }
.pa {
                display: block
                }
.sp {
                display: none
                }
.pc_pa {
                display: block
                }
.pa_sp {
                display: block
                }
                }

@media screen and (min-width: 900px) {
html {
                font-size: 62.5%
                }
body {
                font-size: 1.4rem
                }
.pc {
                display: block
                }
.pa {
                display: none
                }
.sp {
                display: none
                }
.pc_pa {
                display: block
                }
.pa_sp {
                display: none
                }
a[href^="tel:"] {
                pointer-events: none
                }
                }

:root {
                /*--BtnBorder: transparent;
                --BtnBg: #d6d6d6;
                --BtnText: #fff;
                --BtnBorderOver: transparent;
                --BtnBgOver: #ccc;
                --BtnTextOver: #fff;*/
                
                --BtnBorder: #999;
                --BtnBg: #fff;
                --BtnText: #555;
                --BtnBorderOver: #999;
                --BtnBgOver: #f3f3f3;
                --BtnTextOver: #555;
                }

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

menu

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

.menu .hamburger {
                display: block;
                position: fixed;
                left: 1em;
                top: 1.2em;
                width: 16px;
                height: 14px;
                cursor: pointer;
                z-index: 1001
                }

.menu .hamburger div {
                position: relative
                }

.menu .hamburger span {
                display: block;
                position: absolute;
                width: 100%;
                border-bottom: solid 1px #000;
                -webkit-transition: .35s ease-in-out;
                -moz-transition: .35s ease-in-out;
                transition: .35s ease-in-out;
                transform: rotate(0deg)
                }

.menu .hamburger span:nth-child(1) {
                top: 0
                }

.menu .hamburger span:nth-child(2) {
                top: 7px
                }

.menu .hamburger span:nth-child(3) {
                top: 14px
                }

.menu .drawer-menu {
                display: none;
                letter-spacing: 0.1em
                }

.menu .drawer-menu .menu_list2 {
                padding-bottom: 1em
                }

.menu .drawer-menu .menu_list2:first-of-type {
                border-top: 1px solid #dedede
                }

.menu .drawer-menu .menu_list2 ul {
                padding-bottom: 1.2em;
                line-height: 2em
                }

.menu .drawer-menu .menu_list2 ul li {
                font-size: 1.3rem
                }

.menu .drawer-menu .menu_list2 ul li.ttl_menu2 {
                color: #a9a9a9;
                font-size: 1.1rem;
                border-bottom: 1px solid #dedede;
                width: 15em;
                padding-bottom: 0.8em;
                margin: 0 auto 0.8em;
                font-weight: normal;
                line-height: 1.6em;
                }

@media screen and (min-width: 600px) {
.menu .hamburger {
                top: 1.5em
                }
                }

.menu.on .hamburger span:nth-child(1) {
                top: 7px;
                -webkit-transform: rotate(-45deg);
                -moz-transform: rotate(-45deg);
                transform: rotate(-45deg)
                }

.menu.on .hamburger span:nth-child(2), .menu.on .hamburger span:nth-child(3) {
                top: 7px;
                -webkit-transform: rotate(45deg);
                -moz-transform: rotate(45deg);
                transform: rotate(45deg)
                }

.menu.on .drawer-menu {
                text-align: center;
                display: block;
                position: fixed;
                top: 0;
                left: 0;
                background: #fff;
                width: 100%;
                height: 100%;
                padding: 0;
                -webkit-transition: .5s ease-in-out;
                -moz-transition: .5s ease-in-out;
                transition: .5s ease-in-out;
                overflow: scroll;
                z-index: 1000
                }

.menu.on .drawer-menu .menu_list .ttl_menu {
                border-top: 1px solid #dedede;
                height: 45px;
                line-height: 45px;
                font-weight: bold
                }

.menu.on .drawer-menu .menu_list .ttl_menu a {
                display: block;
                border-bottom: none
                }

.menu.on .drawer-menu .menu_list .ttl_menu a:hover {
                background: #f5f5f5
                }

.menu.on .drawer-menu .menu_list .ttl_menu .menu_list2 {
                padding-top: 2em
                }

.menu.on .drawer-menu .menu_list .ttl_menu .menu_list2 a:hover {
                text-decoration: underline;
                background: none
                }

.menu.on .drawer-menu .menu_list .ttl_menu.sub_y {
                height: auto
                }

@media screen and (min-width: 900px) {
.menu .drawer-menu .menu_list .ttl_menu.on a span, .menu .drawer-menu .menu_list .ttl_menu:hover a span, body.about .ttl_menu:nth-of-type(1) a span, body.products .ttl_menu:nth-of-type(2) a span, body.support .ttl_menu:nth-of-type(3) a span {
                background: #ededed;
                border-radius: 1em;
                border: none
                  }
.menu .hamburger {
                display: none
                }
.menu .drawer-menu {
                display: block;
                position: static;
                font-weight: bold
                }
.menu .drawer-menu .menu_list {
                font-size: 1.1rem;
                display: flex;
                align-items: center
                }
.menu .drawer-menu .menu_list .menu_list2 {
                display: flex;
                align-items: flex-start;
                width: 100%;
                padding-bottom: 0;
                background: #fff;
                visibility: hidden;
                opacity: 0;
                position: absolute;
                top: calc(1.4rem * 2 * 2 + 1.4rem * 1.4);
                left: 0;
                transition: .5s;
                z-index: 99
                }
.menu .drawer-menu .menu_list .menu_list2:first-of-type {
                border-top: none
                }
.menu .drawer-menu .menu_list .menu_list2>li {
                width: calc(100% / 3);
                align-self: flex-start
                }
.menu .drawer-menu .menu_list .menu_list2 ul li {
                padding-bottom: 1.6em;
                font-size: 1.2rem
                }
.menu .drawer-menu .menu_list .menu_list2 ul li.ttl_menu2 {
                padding: 2em 0 1em;
                margin-bottom: 2em;
                font-size: 1.2rem;
                font-weight: normal;
                }
.menu .drawer-menu .menu_list .menu_list2 ul li a:hover {
                text-decoration: underline
                }
.menu .drawer-menu .menu_list .ttl_menu {
                padding: 0
                }
.menu .drawer-menu .menu_list .ttl_menu a {
                padding: 0 1em;
                height: auto;
                display: inline-block;
                border-bottom: none
                }
.menu .drawer-menu .menu_list .ttl_menu a span {
                display: inline-block;
                padding: 0 .5em;
                height: 2em;
                line-height: 2em
                }
.menu .drawer-menu .menu_list .ttl_menu a:hover {
                background: none
                }
.menu .drawer-menu .menu_list .ttl_menu:hover .menu_list2 {
                top: calc(1.4rem * 2 * 2 + 1.4rem * 1.4);
                display: flex;
                align-items: flex-start;
                visibility: visible;
                opacity: 1
                }
.menu .drawer-menu .menu_list .ttl_menu:last-of-type {
                display: inline-block;
                padding-right: 0
                }
.menu .drawer-menu .menu_list .ttl_menu:last-of-type::before {
                content: '|';
                color: #a9a9a9;
                padding-right: 1.5em;
                margin-left: 1.5em
                }
                }


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

common

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

body {
                text-align: center;
                width: 100%
                }

.wrapper {
                margin-top: calc(1.1em + 1.2em * 2);
                width: 100%
                }

.inner {
                padding: 0 8%;
                margin: 0 auto
                }

.logo {
                color: #888
                }

.logo .logo_svg {
                fill: #a9a9a9
                }

.btn {
                font-size: 1.1rem;
                letter-spacing: 0.2em;
                text-align: center
                }

.btn a {
                display: block;
                border: 1px solid var(--BtnBorder);
                background-color: var(--BtnBg);
                color: var(--BtnText);
                border-radius: 2em;
                height: 4em;
                line-height: 4em;
                width: 14.5em;
	-webkit-transition: all .6s;
	-moz-transition: all .6s;
	-o-transition: all .6s;
	-ms-transition: all .6s;
	transition: all .6s;
                }

.btn a:hover {
                border: 1px solid var(--BtnBorderOver);
                background: var(--BtnBgOver);
                }

.date {
                font-size: 1.1rem
                }

@media screen and (min-width: 600px) {
.btn {
                font-size: 1.2rem
                }
.wrapper {
                margin-top: calc(1.2em + 1.5em * 2)
                }
                }

@media screen and (min-width: 900px) {
body {
                width: 100%
                }
.wrapper {
                margin-top: calc(1.4rem * 2 * 2 + 1.4rem * 1.4)
                }
.inner {
                width: 100%;
                padding: 0 4%;
                max-width: 1400px
                }
                }

.hdr {
                width: 100%;
                z-index: 100;
                background: rgba(255, 255, 255, 1);
                border-bottom: 1px solid #dedede;
                position: fixed;
                top: 0;
                left: 0
                }

.hdr a {
                border-bottom: none
                }

.hdr a:hover {
                border-bottom: none
                }

.hdr .logo {
                text-align: center;
                max-width: 70%;
                margin: 0 auto
                }

.hdr .logo a {
                display: block;
                height: 1.1em;
                width: auto;
                margin: 1.2em auto;
                text-align: center
                }

.hdr .logo svg {
                height: 100%;
                width: auto;
                display: inline;
                vertical-align: top
                }

@media screen and (min-width: 600px) {
.hdr .logo a {
                height: 1.2em;
                margin: 1.5em auto
                }
                }

@media screen and (min-width: 900px) {
.hdr {
                height: calc(1.4rem * 2 * 2 + 1.4rem * 1.4);
                line-height: calc(1.4rem * 2 * 2 + 1.4rem * 1.4);
                display: flex;
                justify-content: space-between
                }
.hdr .logo {
                width: auto;
                padding-top: 2.8rem;
                padding-left: 3em;
                margin: 0
                }
.hdr .logo a {
                margin: 0 auto
                }
.hdr .logo svg {
                height: 1.4em;
                margin: 0
                }
                }

.ttl h1 {
                font-size: 2.1rem;
                line-height: 1.4em;
                padding: 1.6em 0
                }

@media screen and (min-width: 600px) {
.ttl h1 {
                font-size: 3.1rem
                }
                }

@media screen and (min-width: 900px) {
.ttl .inner {
                max-width: 700px;
                padding: 0
                }
.ttl h1 {
                padding: 1.5em 0
                }
                }

.contents {
                /*text-align: left;*/
	text-align: justify;
	text-justify: inter-ideograph;
                padding-bottom: 4em
                }

@media screen and (min-width: 900px) {
.contents .inner {
                max-width: 700px;
                padding: 0
                }
                }

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

breadcrumb

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

.breadcrumb {
                display: none;
                width: 100%;
                padding: 1.5rem 0;
                background-color: #f3f3f3;
                }
@media screen and (min-width: 600px) {
.breadcrumb {
                display: block;
                }
                }

.breadcrumb .inners{
                width: 100%;
                margin: auto;
                padding: 0 3.2em;
                }


.breadcrumb .inners p{
                font-size: .9em;
                line-height: 1em;
                text-align: left;
                color: #999;
                }

.breadcrumb .inners p a{
                color: #999;                
                border-bottom: 1px solid transparent;
                }

.breadcrumb .inners p a:hover{
                color: #999;                
                border-bottom: 1px solid #999;
                }


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

ftr

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

.ftr {
                text-align: left;
                line-height: 1.8em;
                font-size: 1.2rem;
                color: #a9a9a9
                }

.ftr a {
                text-decoration: underline;
                border-bottom: none
                }

.ftr a:hover {
                text-decoration: none
                }

.ftr .sns {
                text-align: center;
                font-size: 1.8rem;
                border-top: 1px solid #dedede;
                display: flex;
                justify-content: center;
                align-items: center;
                height: 6em
                }

.ftr .sns li {
                padding: 0 1em
                }

.ftr .sns li img {
                width: 1.7em
                }

.ftr .sns li a {
                text-decoration: none;
                color: #a9a9a9
                }

.ftr .sns li a:hover {
                opacity: 0.5;
                filter: alpha(opacity=50)
                }

.ftr .ftr_upper {
                background: #f5f5f5;
                padding-bottom: 3em;
                letter-spacing: 0.1em
                }

.ftr .ftr_upper .logo {
                padding: 5em 0 4.5em
                }

.ftr .ftr_upper .logo svg {
                height: 1.9em
                }

.ftr .ftr_upper .ftr_menu .menu_list {
                padding-bottom: 0.5em
                }

.ftr .ftr_upper .ftr_menu .menu_list ul ul {
                padding-bottom: 1em
                }

.ftr .ftr_upper .ftr_menu .menu_list li li::before {
                content: '-';
                margin-right: 0.5em
                }

.ftr .ftr_upper .ftr_menu .menu_list .ttl_menu::before, .ftr .ftr_upper .ftr_menu .menu_list .ttl_menu2::before {
                content: none
                }

.ftr .ftr_upper .ftr_menu .menu_list .ttl_menu {
                font-size: 1.2rem;
                padding: 0 0 0.5em
                }

.ftr .ftr_upper .ftr_menu .menu_list .ttl_menu2 {
                font-weight: bold
                }

.ftr .ftr_btm {
                padding: 2em 0
                }

.ftr .ftr_btm ul {
                padding-bottom: 2em
                }

@media screen and (min-width: 600px) {
.ftr .ftr_upper .inner .ftr_menu {
                display: flex;
                justify-content: space-between
                }
.ftr .ftr_btm ul {
                display: flex
                }
.ftr .ftr_btm ul li {
                padding-right: 2em
                }
                }

@media screen and (min-width: 900px) {
.ftr {
                font-size: 1.1rem;
                line-height: 1.4em
                }
.ftr .sns {
                height: 6em
                }
.ftr .sns li {
                padding: 0 1.1em
                }
.ftr .ftr_upper {
                padding-bottom: 3em;
                padding-top: 8em
                }
.ftr .ftr_upper .logo {
                padding-top: 0
                }
.ftr .ftr_upper .inner {
                display: flex;
                justify-content: space-between
                }
.ftr .ftr_upper .inner .ftr_menu {
                padding: 0 0;
                min-width: 60em;
                display: flex;
                justify-content: space-between
                }
.ftr .ftr_upper .inner .ftr_menu .menu_list li {
                padding-bottom: 1em
                }
.ftr .ftr_upper .inner .ftr_menu .menu_list li.ttl_menu {
                padding-bottom: 2em
                }
.ftr .ftr_btm {
                padding: 3em 0
                }
.ftr .ftr_btm .inner {
                display: flex;
                justify-content: space-between
                }
.ftr .ftr_btm ul {
                padding-bottom: 0
                }
.ftr .ftr_btm ul li {
                padding-right: 3em
                }
                }


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

top

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

/*------------------------
top : default
--------------------------*/

body.top .wrapper {
                margin-top: 0
                }

body.top .btn {
                font-weight: bold
                }

body.top .btn a {
                margin: 0 auto
                }


/*------------------------
top : ttl
--------------------------*/

body.top .ttl {
                position: relative;
                margin-bottom: 4em
                }

body.top .ttl h1 {
                position: absolute;
                top: calc(50% - 9em);
                left: 0;
                width: 100%
                }

body.top .ttl svg {
                fill: #fff;
                margin: 0 auto
                }

body.top .ttl .logo .logo_svg {
                height: 2.6em;
                margin-bottom: 1.5em
                }

body.top .ttl .copy {
                height: 0.7em
                }

body.top .ttl .img {
                margin-bottom: 3em
                }

body.top .ttl .img img {
                width: 100%;
                height: auto
                }

body.top .ttl .txt {
                font-size: 1.4rem;
                color: #888;
                line-height: 2.4em;
                padding-bottom: 1.5em
                }

@media screen and (min-width: 600px) {
body.top .ttl {
                margin-bottom: 5em
                }
body.top .ttl h1 {
                top: calc(50% - 8em)
                }
body.top .ttl .txt {
                font-size: 1.8rem
                }
                }

@media screen and (min-width: 900px) {
body.top .ttl {
                margin-bottom: 6em
                }
body.top .ttl h1 {
                top: calc(50% - 8em)
                }
body.top .ttl .logo .logo_svg {
                width: 30%;
                height: auto
                }
body.top .ttl .copy {
                width: 25%;
                height: auto
                }
body.top .ttl .img {
                margin-bottom: 6em
                }
body.top .ttl .txt {
                padding-bottom: 2em;
                letter-spacing: 0.2em
                }
                }


/*------------------------
top : products
--------------------------*/

body.top .contents .products {
                max-width: 100%;
                margin: auto;
                }

body.top .contents .products .unit_item {
                position: relative;
                margin-bottom: 3em
                }

body.top .contents .products .unit_item img.mark_new {
                display: none;
                position: absolute;
                top: -15px;
                right: 5px;
                width: 80px;
                height: 80px;
                }

body.top .contents .products .unit_item a {
                display: block
                }

body.top .contents .products .unit_item a:hover {
                border-bottom: 1px solid transparent
                }

body.top .contents .products .unit_item a:hover .btn {
                border: 1px solid var(--BtnBorderOver);
                background: var(--BtnBgOver);
                }
                }

body.top .contents .products .unit_item .img {
                margin-bottom: 1.5em
                }

body.top .contents .products .unit_item .img img {
                width: 100%
                }

body.top .contents .products .unit_item .txt {
                text-align: center
                }

body.top .contents .products .unit_item .txt .cat {
                margin-top: 1rem;
                font-size: 1.2rem
                }

body.top .contents .products .unit_item .txt .ja {
                font-size: 1.3rem
                }

body.top .contents .products .unit_item .txt .en {
                margin-bottom: 1.2em;
                line-height: 1.4em;
                font-size: 1.9rem
                }

body.top .contents .products .unit_item .txt .btn {
                font-size: 1.1rem;
                letter-spacing: 0.2em;
                text-align: center;
                border: 1px solid var(--BtnBorder);
                background-color: var(--BtnBg);
                color: var(--BtnText);
                border-radius: 2em;
                height: 4em;
                line-height: 4em;
                width: 14.5em;
                margin: 0 auto
                }

@media screen and (min-width: 600px) {
body.top .contents .products {
                max-width: 90%;
                margin: auto;
                }
body.top .contents .products .unit_item {
                position: relative;
                margin-bottom: 3em
                }
body.top .contents .products .unit_item img.mark_new {
                position: absolute;
                top: -5px;
                right: -5px;
                width: 80px;
                height: 80px;
                }
body.top .contents .products .unit_item a {
                display: block
                }
body.top .contents .products .unit_item a:hover {
                border-bottom: 1px solid transparent
                }
body.top .contents .products .unit_item .img {
                margin-bottom: 1.5em
                }
body.top .contents .products .unit_item .img img {
                width: 100%
                }
body.top .contents .products .unit_item .txt {
                text-align: center
                }
body.top .contents .products .unit_item .txt .btn {
                font-size: 1.1rem;
                letter-spacing: 0.2em;
                text-align: center;
                border-radius: 2em;
                height: 4em;
                line-height: 4em;
                width: 14.5em;
                margin: 0 auto
                }
body.top .contents .products .unit_item {
                margin: auto;
                margin-bottom: 2em;
                border: 1px solid #dedede;
                padding-bottom: 3rem;
                }
body.top .contents .products .unit_item .img {
                margin-bottom: 2rem;
                }
body.top .contents .products .unit_item .txt .cat {
                margin-top: 1rem;
                font-size: 1.2rem
                }
body.top .contents .products .unit_item .txt .ja {
                font-size: 1.5rem;
                line-height: 1.6em;
                margin: 1em 0 1em;
                }
body.top .contents .products .unit_item .txt .en {
                margin-bottom: 1em;
                line-height: 1.4em;
                font-size: 3.6vw
                }
                }

@media screen and (min-width: 900px) {
body.top .contents .products {
                max-width: 90%;
                margin: auto;
                }

body.top .contents .products .unit_item {
                position: relative;
                margin-bottom: 3em
                }

body.top .contents .products .unit_item img.mark_new {
                position: absolute;
                top: -5px;
                right: -5px;
                width: 80px;
                height: 80px;
                }

body.top .contents .products .unit_item a {
                display: block
                }

body.top .contents .products .unit_item a:hover {
                border-bottom: 1px solid transparent
                }

body.top .contents .products .unit_item .img {
                margin-bottom: 1.5em
                }

body.top .contents .products .unit_item .img img {
                width: 100%
                }

body.top .contents .products .unit_item .txt {
                text-align: center
                }

body.top .contents .products .unit_item .txt .ja {
                font-size: 1.2rem
                }

body.top .contents .products .unit_item .txt .en {
                margin-bottom: 2em;
                line-height: 1.4em;
                font-size: 2.1rem
                }

body.top .contents .products .unit_item .txt .btn {
                font-size: 1.1rem;
                letter-spacing: 0.2em;
                text-align: center;
                border-radius: 2em;
                height: 4em;
                line-height: 4em;
                width: 14.5em;
                margin: 0 auto
                }
body.top .contents .products .unit_item {
                margin: auto;
                margin-bottom: 2em;
                border: 1px solid #dedede;
                padding-bottom: 3rem;
                }
body.top .contents .products .unit_item .img {
                margin-bottom: 2rem;
                }
body.top .contents .products .unit_item .cat {
                font-size: 1.3rem;
                line-height: 1.6em;
                margin: 0 0 1em;
                }
body.top .contents .products .unit_item .txt .ja {
                font-size: 1.5rem;
                line-height: 1.6em;
                margin: 2em 0 1em;
                }
body.top .contents .products .unit_item .txt .en {
                font-size: 3.6vw
                }
body.top .contents .products .unit_item {
                margin-bottom: 5em;
                padding-bottom: 0;
                }
body.top .contents .products .unit_item a {
                display: flex;
                align-items: center;
                margin-bottom: 0;
                border: 0 !important;
                }
body.top .contents .products .unit_item a .img {
                margin-bottom: 0;
                width: 60%;
                }
body.top .contents .products .unit_item a .txt {
                width: 40%;
                padding: 0
                }
body.top .contents .products .unit_item .txt .en {
                font-size: 1.6vw
                }
body.top .contents .products .unit_item a .txt .btn {
                margin: auto;
	-webkit-transition: all .6s;
	-moz-transition: all .6s;
	-o-transition: all .6s;
	-ms-transition: all .6s;
	transition: all .6s;
                }
                }


/*------------------------
top : products 小表示
--------------------------*/

body.top .contents .products-small {
                width: 100%;
                margin: auto;
                padding-bottom: 1rem;
                display: flex;
                justify-content: space-between;
                flex-wrap: wrap;
                flex-direction: row;
                column-gap: 1%;
                }

body.top .contents .products-small .unit_item {
                width: 48%;
                margin-bottom: 1em;
                padding-bottom: 1.5em;
                display: flex;
                flex-direction: column;
                text-align: center;
                }

body.top .contents .products-small .unit_item a {
                display: flex;
                flex-direction: column;
                width: 100%;
                height: 100%;
                border-bottom: 1px solid transparent
                }

body.top .contents .products-small .unit_item a:hover {
                border-bottom: 1px solid transparent
                }

body.top .contents .products-small .unit_item .img {
                margin-bottom: .6rem
                }

body.top .contents .products-small .unit_item .img img {
                width: 100%
                }

body.top .contents .products-small .unit_item h2{
                padding: 0 1rem;
                }

body.top .contents .products-small .unit_item .cat {
                font-size: 1rem;
                line-height: 1.6em;
                margin: 1em 0 1em;
                }

body.top .contents .products-small .unit_item .ja {
                font-size: 1.1rem;
                line-height: 1.6em;
                margin: 1em 0 1em;
                }

body.top .contents .products-small .unit_item .en {
                display: none;
                font-size: 1.4rem;
                line-height: 1.4em;
                margin-bottom: 1.6em;
                }

body.top .contents .products-small .unit_item .btn {
                font-size: 1rem;
                letter-spacing: 0.2em;
                text-align: center;
                border: 1px solid var(--BtnBorder);
                background-color: var(--BtnBg);
                 color: var(--BtnText);
                border-radius: 2em;
                height: 3em;
                line-height: 3em;
                width: 10.5em;
                margin: 0 auto;
                margin-top : auto;
                }

body.top .contents .products-small .unit_item a:hover .btn {
                border: 1px solid var(--BtnBorderOver);
                background: var(--BtnBgOver);
                }

@media screen and (min-width: 600px) {
body.top .contents .products-small {
                width: 90%;
                margin: auto;
                display: flex;
                justify-content: space-between;
                flex-wrap: wrap;
                flex-direction: row;
                column-gap: 3%;
                }

body.top .contents .products-small .unit_item {
                width: 48%;
                margin-bottom: 1em;
                padding-bottom: 3em;
                display: flex;
                flex-direction: column;
                text-align: center;
                }

body.top .contents .products-small .unit_item a {
                display: flex;
                flex-direction: column;
                width: 100%;
                height: 100%;
                border-bottom: 1px solid transparent
                }

body.top .contents .products-small .unit_item a:hover {
                border-bottom: 1px solid transparent
                }

body.top .contents .products-small .unit_item .img {
                margin-bottom: 1rem
                }

body.top .contents .products-small .unit_item .img img {
                width: 100%
                }

body.top .contents .products-small .unit_item .cat {
                font-size: 1.2rem;
                line-height: 1.6em;
                margin: 2em 0 1em;
                }

body.top .contents .products-small .unit_item .ja {
                font-size: 1.3rem;
                line-height: 1.6em;
                margin: 1em 0 1em;
                }

body.top .contents .products-small .unit_item .en {
                display: block;
                margin-bottom: 1.6em;
                line-height: 1.4em;
                font-size: 1.8rem;
                }

body.top .contents .products-small .unit_item .btn {
                font-size: 1rem;
                letter-spacing: 0.2em;
                text-align: center;
                border-radius: 2em;
                height: 3em;
                line-height: 3em;
                width: 10.5em;
                margin: 0 auto;
                margin-top : auto;
                }
                }

@media screen and (min-width: 1100px) {
body.top .contents .products-small {
                width: 90%;
                margin: auto;
                display: flex;
                justify-content: flex-start;
                flex-wrap: wrap;
                flex-direction: row;
                column-gap: 5%;
                }

body.top .contents .products-small .unit_item {
                width: 30%;
                margin-bottom: 3em;
                padding-bottom: 3em;
                display: flex;
                flex-direction: column;
                text-align: center;
                }

body.top .contents .products-small .unit_item a {
                display: flex;
                flex-direction: column;
                width: 100%;
                height: 100%;
                border-bottom: 1px solid transparent
                }

body.top .contents .products-small .unit_item a:hover {
                border-bottom: 1px solid transparent
                }

body.top .contents .products-small .unit_item .img {
                margin-bottom: .5em
                }

body.top .contents .products-small .unit_item .img img {
                width: 100%
                }

body.top .contents .products-small .unit_item .cat {
                font-size: 1.2rem;
                line-height: 1.6em;
                margin: 2em 0 1em;
                }

body.top .contents .products-small .unit_item .ja {
                font-size: 1.4rem;
                line-height: 1.6em;
                margin: 2em 0 1em;
                }

body.top .contents .products-small .unit_item .en {
                margin-bottom: 1.6em;
                line-height: 1.4em;
                font-size: 2rem;
                }

body.top .contents .products-small .unit_item .btn {
                font-size: 1.1rem;
                letter-spacing: 0.2em;
                text-align: center;
                border-radius: 2em;
                height: 4em;
                line-height: 4em;
                width: 14.5em;
                margin: 0 auto;
                margin-top : auto;
	-webkit-transition: all .6s;
	-moz-transition: all .6s;
	-o-transition: all .6s;
	-ms-transition: all .6s;
	transition: all .6s;
                }
                }

/*------------------------
top : PRODUCTS LIST
--------------------------*/

body.top .contents .productslist {
                width: 90%;
                margin: auto;
                display: flex;
                align-items: flex-start;
                justify-content: space-between;
                margin-bottom: 10rem;
                }
@media screen and (max-width: 1100px) {
body.top .contents .productslist {
                flex-wrap: wrap;
                }
                }
@media screen and (max-width: 900px) {
body.top .contents .productslist {
                width: 84%;
                margin-top: 6rem;
                margin-bottom: 8rem;
                }
                }

body.top .contents .productslist .categoly{
                width: 23%;
                display: flex;
                align-items: center;
                flex-direction: column;
                }
@media screen and (max-width: 1100px) {
body.top .contents .productslist .categoly{
                width: 48%;
                }
body.top .contents .productslist .categoly:nth-child(n+3) {
                margin-top: 4rem;
                }
                }
@media screen and (max-width: 600px) {
body.top .contents .productslist .categoly{
                width: 100%;
                }
body.top .contents .productslist .categoly:nth-child(n+2) {
                margin-top: 4rem;
                }
                }

body.top .contents .productslist .categoly .cathead{
                width: 100%;
                padding: 4rem 0;
                border-bottom: 1px solid #dedede;
                text-align: center;
                }
@media screen and (max-width: 1100px) {
body.top .contents .productslist .categoly .cathead{
                padding: 4rem 0 0;
                border-top: 1px solid #dedede;
                border-bottom: none;
                }
                }

body.top .contents .productslist .categoly p.cat-en{
                letter-spacing: .05em;
                }

body.top .contents .productslist .categoly p.cat-jp{
                letter-spacing: .05em;
                }

body.top .contents .productslist .categoly ul{
                width: 100%;
                list-style-type: none;
                margin: auto;
                padding:0;
                }
@media screen and (max-width: 1100px) {
body.top .contents .productslist .categoly ul{
                margin-top: 3rem;
                }
                }

body.top .contents .productslist .categoly ul li {
                width: 100%;
                height: auto;
                padding-bottom: 2rem;
                padding-top: 2rem;
                border-top: 1px solid #efefef;
                }

body.top .contents .productslist .categoly ul li:first-child {
                border-top: none;
                }

body.top .contents .productslist .categoly ul li a{
                display: flex;
                align-items: center;
                justify-content: space-between;
                }

body.top .contents .productslist .categoly ul li a:hover{
                border-bottom: 1px solid transparent;
                }

body.top .contents .productslist .categoly ul li a .thm{
                width: 25%;
                }

body.top .contents .productslist .categoly ul li a .thm img{
                width: 100%;
                height: auto;
                }

body.top .contents .productslist .categoly ul li a .name{
                width: 70%;
                }

body.top .contents .productslist .categoly ul li a .name p{
                text-align: left;
                font-size: 1.1rem;
                line-height: 1.4em;
                }

body.top .contents .productslist .categoly ul li a .name p:first-child{
                font-size: 1.5rem;
                letter-spacing: .05em;
                color: #000;
                border-bottom: 1px solid transparent;
                }

body.top .contents .productslist .categoly ul li a:hover .name p:first-child{
                text-decoration: underline;
                }

body.top .contents .productslist .categoly ul li a .name p:nth-child(2){
                margin-top: .5em;
                }







/*------------------------
top : column
--------------------------*/

body.top .contents .column {
                width: 100%;
                margin: auto;
                padding: 3em 0 3.5em;
                background-color: #f5f5f5;
                }

body.top .contents .column .ttl2 {
                color: #a9a9a9;
                font-size: 1.8rem;
                margin-bottom: 2em;
                text-align: center
                }

body.top .contents .column ._scroll {
                overflow: auto;
                -webkit-overflow-scrolling: touch;
	}

body.top .contents .column ._scroll::-webkit-scrollbar{
                display: none;
                }
body.top .contents .column ._scroll::-webkit-scrollbar-track{
                background: #fff;
                }
body.top .contents .column ._scroll::-webkit-scrollbar-thumb {
                background: #fff;
                }

body.top .contents .column .innner{
	width: 180%;
                display: flex;
                justify-content: space-between;
                flex-wrap: nowrap;
                flex-direction: row;
                padding: 0 8%;
                }

body.top .contents .column .unit_item {
                width: 30%;
                margin-bottom: 1em;
                padding-bottom: 1.5em;
                display: flex;
                flex-direction: column;
                text-align: left;
                }

body.top .contents .column .unit_item a {
                display: flex;
                flex-direction: column;
                width: 100%;
                height: 100%;
                border-bottom: 1px solid transparent
                }

body.top .contents .column .unit_item a:hover {
                border-bottom: 1px solid transparent
                }

body.top .contents .column .unit_item .img {
                margin-bottom: .6rem
                }

body.top .contents .column .unit_item .img img {
                width: 100%
                }

body.top .contents .column .unit_item h2{
                padding: 0 1rem;
                }

body.top .contents .column .unit_item .day {
                color: #555;
                font-size: 1.3rem;
                line-height: 1.6em;
                margin: 1em 0 1em;
                }

body.top .contents .column .unit_item .ja {
                color: #555;
                font-size: 1.3rem;
                line-height: 1.6em;
                margin: 1em 0 1em;
	text-align: justify;
	text-justify: inter-ideograph;
                }

body.top .contents .column .unit_item a:hover .ja:nth-child(2) {
                text-decoration: underline;
                }

@media screen and (min-width: 600px) {
body.top .contents .column {
                width: 100%;
                margin: auto;
                padding: 3em 0 3.5em;
                background-color: #f5f5f5;
                }
body.top .contents .column .ttl2 {
                color: #a9a9a9;
                font-size: 2.2rem;
                margin-bottom: 2em;
                text-align: center
                }
body.top .contents .column ._scroll {
                overflow: auto;
                -webkit-overflow-scrolling: touch;
	}
body.top .contents .column ._scroll::-webkit-scrollbar{
                display: none;
                }
body.top .contents .column ._scroll::-webkit-scrollbar-track{
                background: #fff;
                }
body.top .contents .column ._scroll::-webkit-scrollbar-thumb {
                background: #fff;
                }
body.top .contents .column .innner{
	width: 100%;
                display: flex;
                justify-content: space-between;
                flex-wrap: nowrap;
                flex-direction: row;
                }
body.top .contents .column .unit_item {
                width: 29%;
                margin-bottom: 1em;
                padding-bottom: 1.5em;
                display: flex;
                flex-direction: column;
                text-align: left;
                }
body.top .contents .column .unit_item a {
                display: flex;
                flex-direction: column;
                width: 100%;
                height: 100%;
                border-bottom: 1px solid transparent
                }
body.top .contents .column .unit_item a:hover {
                border-bottom: 1px solid transparent
                }
body.top .contents .column .unit_item .img {
                margin-bottom: .6rem
                }
body.top .contents .column .unit_item .img img {
                width: 100%
                }
body.top .contents .column .unit_item h2{
                padding: 0 1rem;
                }
body.top .contents .column .unit_item .day {
                color: #555;
                font-size: 1.3rem;
                line-height: 1.6em;
                margin: 1em 0 1em;
                }
body.top .contents .column .unit_item .ja {
                font-size: 1.3rem;
                line-height: 1.6em;
                margin: 1em 0 1em;
                text-align: left;
                }
                }

@media screen and (min-width: 900px) {
body.top .contents .column ._scroll {
                padding: 0;
                overflow: auto;
                -webkit-overflow-scrolling: touch;
	}
body.top .contents .column .innner{
	width: 75%;
                max-width: 1200px;
                margin: auto;
                padding: 0 0;
                display: flex;
                justify-content: space-between;
                flex-wrap: nowrap;
                flex-direction: row;
                }
body.top .contents .column .unit_item .day {
                color: #555;
                font-size: 1.3rem;
                line-height: 1.6em;
                margin: 1em 0 1em;
                }
body.top .contents .column .unit_item .ja {
                font-size: 1.5rem;
                line-height: 1.6em;
                margin: 1em 0 1em;
                }
                }


/*------------------------
top : news
--------------------------*/

body.top .contents .news {
                padding: 3em 0 1em
                }

body.top .contents .news .ttl2 {
                color: #a9a9a9;
                font-size: 1.8rem;
                margin-bottom: 1em;
                text-align: center
                }

body.top .contents .news .inner {
                max-width: 100%
                }

body.top .contents .news ul {
                text-align: left;
                font-size: 1.3rem;
                line-height: 1.9em
                }

body.top .contents .news ul li {
                border-bottom: 1px solid #dedede;
                margin-bottom: 1em;
                padding-bottom: 1em;
                color: #555
                }

body.top .contents .news ul li:last-of-type {
                /*border-bottom: none*/
                }

body.top .contents .news ul .date {
                padding: 0 0 .6em;
                font-size: 1.3rem;
                }

@media screen and (min-width: 600px) {
                }

@media screen and (min-width: 900px) {
body.top .contents .news {
                padding: 3.5em 0 0;
                }
body.top .contents .news .ttl2 {
                color: #a9a9a9;
                font-size: 2.2rem;
                margin-bottom: 2em;
                text-align: center
                }
body.top .contents .news .inner {
                width: 75%;
                max-width: 1200px;
                }
body.top .contents .news ul {
                text-align: left;
                font-size: 1.5rem;
                line-height: 1.9em;
                display: flex;
                align-items: flex-start;
                justify-content: space-between;
                flex-wrap: nowrap;
                flex-direction: column;
                }
body.top .contents .news ul li {
                width: 100%;
                border-bottom: 1px solid #dedede;
                margin-bottom: 1em;
                padding-bottom: 1em;
                color: #555;
                display: flex;
                align-items: flex-start;
                justify-content: flex-start;
                flex-wrap: nowrap;
                flex-direction: row;
                column-gap: 3rem;
                }
body.top .contents .news ul li:last-of-type {
                /*border-bottom: none*/
                }
body.top .contents .news ul .date {
                padding: 0 0 0;
                font-size: 1.5rem;
                width: 6em;
                white-space: nowrap;
                }
                }


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

about

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

body.about .ttl .img img {
                width: 100%
                }

body.about .ttl h1.logo {
                padding: 2.6em 0 3em
                }

body.about .ttl h1.logo p {
                font-size: 1.5rem;
                color: #888;
                padding-bottom: 1em
                }

body.about .ttl h1.logo svg {
                width: 36%;
                margin: 0 auto
                }

body.about .contents .unit_about {
                padding-bottom: 3em
                }

body.about .contents .unit_about .en {
                font-size: 1.3rem
                }

body.about .contents .unit_about .ja {
                font-size: 2rem
                }

body.about .contents .unit_about .img {
                padding-bottom: 3em;
                width: 91.6vw
                }

body.about .contents .unit_about .img img {
                width: 100%
                }

body.about .contents .unit_about .txt {
                text-align: left;
                padding: 0 8%
                }

body.about .contents .unit_about .txt .ttl_unit {
                padding-bottom: 1.5em;
                line-height: 1.6em
                }

body.about .contents .unit_about .txt .detail {
                color: #888
                }

body.about .contents .unit_about:nth-of-type(2n) .img {
                float: right
                }

@media screen and (min-width: 600px) {
body.about .ttl h1.logo {
                padding: 3.6em 0 4em
                }
body.about .ttl h1.logo p {
                font-size: 1.8rem;
                padding-bottom: 2em
                }
body.about .ttl h1.logo svg {
                width: 10em
                }
body.about .contents .unit_about .en {
                font-size: 1.4rem
                }
body.about .contents .unit_about .ja {
                font-size: 2.8rem
                }
                }

@media screen and (min-width: 900px) {
body.about .ttl h1.logo {
                padding: 4em 0 5em
                }
body.about .ttl h1.logo p {
                padding-bottom: 2em
                }
body.about .contents .unit_about {
                padding-bottom: 3em;
                display: flex;
                align-items: center;
                padding-bottom: 8em
                }
body.about .contents .unit_about .img {
                width: 50%;
                float: none;
                padding-bottom: 0
                }
body.about .contents .unit_about .txt {
                width: 50%;
                line-height: 2.5em;
                padding: 0
                }
body.about .contents .unit_about .txt .ttl_unit {
                line-height: 2em
                }
body.about .contents .unit_about .txt .inner_unit {
                width: 80%;
                max-width: 32em;
                min-width: 22em;
                margin: 0 auto
                }
body.about .contents .unit_about:nth-of-type(2n) {
                flex-direction: row-reverse
                }
                }


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

products

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

body.products .ttl h1 {
                border-bottom: 1px solid #dedede
                }

body.products .ttl .ja {
                font-size: 1.3rem
                }

body.products .ttl .en {
                font-size: 2.1rem;
                letter-spacing: .05em
                }

body.products .ttl_main, body.products .ttl_sub {
                background: #f5f5f5;
                text-align: center
                }

body.products .ttl_main .img, body.products .ttl_sub .img {
                width: 100%;
                padding-bottom: 3em
                }

body.products .ttl_main .img img, body.products .ttl_sub .img img {
                width: 100%
                }

body.products .ttl_main .txt, body.products .ttl_sub .txt {
                padding-bottom: 3em
                }

body.products .ttl_main .txt .ttl2, body.products .ttl_sub .txt .ttl2 {
                line-height: 1.6em;
                padding-bottom: 1.4em;
                font-size: 1.8rem
                }

body.products .ttl_main .txt .detail, body.products .ttl_sub .txt .detail {
                /*text-align: left;*/
	text-align: justify;
	text-justify: inter-ideograph;
                /*letter-spacing: 0.05em*/
                }

body.products .ttl_main .ttl3, body.products .ttl_sub .ttl3 {
                font-size: 1.6rem;
                padding-bottom: 1.4em;
                line-height: 1.6em
                }

body.products .ttl_sub {
                position: relative;
                padding-bottom: 2em
                }

body.products .ttl_sub:after {
                content: ' ';
                position: absolute;
                bottom: -25px;
                height: 50px;
                left: 50%;
                border-left: 1px solid #dedede
                }

body.products .ttl_sub .img {
                padding-bottom: 2.2em
                }

@media screen and (min-width: 600px) {
body.products .ttl h1 {
                padding: 1em 0
                }
body.products .ttl .ja {
                font-size: 1.5rem
                }
body.products .ttl .en {
                font-size: 3.3rem;
                letter-spacing: 0.1em
                }
body.products .ttl_main .txt .ttl2, body.products .ttl_sub .txt .ttl2 {
                font-size: 2.8rem
                }
body.products .ttl_main .txt .detail, body.products .ttl_sub .txt .detail {
                font-size: 1.6rem;
                line-height: 2em;
                /*letter-spacing: 0.1em*/
                }
body.products .ttl_main .ttl3, body.products .ttl_sub .ttl3 {
                font-size: 2.2rem
                }
body.products .ttl_sub .txt .detail {
                font-size: 1.5rem
                }
                }

@media screen and (min-width: 900px) {
body.products .ttl_main .img, body.products .ttl_sub .img {
                padding-bottom: 5em
                }
body.products .ttl_main .txt, body.products .ttl_sub .txt {
                padding-bottom: 5em
                }
body.products .ttl_main .txt .ttl2, body.products .ttl_sub .txt .ttl2 {
                padding-bottom: 2em
                }
body.products .ttl_main .txt .detail, body.products .ttl_sub .txt .detail {
                text-align: center
                }
body.products .ttl_sub {
                padding-bottom: 5em;
                margin-bottom: 2em
                }
body.products .ttl_sub:after {
                bottom: -50px;
                height: 100px
                }
body.products .ttl_sub .img {
                width: 70%;
                max-width: 900px;
                margin: 0 auto;
                padding-bottom: 3em
                }
                }

body.products .contents .ttl2 {
                text-align: center;
                font-size: 1.6rem;
                padding-bottom: 2em;
                line-height: 1.6em;
                text-align: center;
                letter-spacing: 0.1em
                }

@media screen and (min-width: 600px) {
body.products .contents .ttl2 {
                font-size: 2.2rem
                }
                }

@media screen and (min-width: 900px) {
body.products .contents .inner {
                max-width: 1100px;
                width: 90%
                }
                }

body.products .contents .about_products {
                margin-bottom: 2em;
                padding-top: 5em
                }

body.products .contents .about_products .slider {
                padding-bottom: 1em
                }

body.products .contents .about_products .slider .swiper-slide {
                text-align: center
                }

body.products .contents .about_products .slider .swiper-slide .img {
                width: 100%
                }

body.products .contents .about_products .slider .swiper-slide .img img {
                width: 90%;
                padding-bottom: 2em;
                margin: 0 auto
                }

body.products .contents .about_products .slider .swiper-slide .cap {
                font-size: 1rem;
                padding-bottom: 2em
                }

body.products .contents .about_products .slider .mySwiper .swiper-wrapper {
                justify-content: center
                }

body.products .contents .about_products .slider .swiper-container-thumbs {
                padding-bottom: 2em
                }

body.products .contents .about_products .slider .swiper-container-thumbs .swiper-slide .img img {
                width: 90%;
                margin: .5em 5%;
                padding-bottom: 0
                }

body.products .contents .about_products .slider .swiper-container-thumbs .swiper-slide-thumb-active {
                border-bottom: 1px solid #555
                }

body.products .contents .about_products .slider .swiper-container-thumbs .cap {
                display: none
                }

body.products .contents .about_products .txt {
                padding-bottom: 3em
                }

body.products .contents .about_products .txt .ttl3 {
                text-align: center;
                padding-bottom: 2em
                }

body.products .contents .about_products .txt .ttl3 .en {
                font-size: 2.1rem;
                letter-spacing: 0.1em;
                padding-bottom: 0.8em
                }

body.products .contents .about_products .txt .ttl3 .price {
                font-size: 1.6rem
                }

body.products .contents .about_products .txt .note {
                padding-top: 1em;
                text-indent: -1em;
                padding-left: 1em
                }

body.products .contents .about_products .buy_ec {
                text-align: center;
                background-color: #f5f5f5;
                }

body.products .contents .about_products .buy_ec li {
                font-size: 1.5rem;
                /*height: 5em;*/
                /*line-height: 5em;*/
                display: block;
                width: 100%;
                padding: 1rem 8% 0;
                }
body.products .contents .about_products .buy_ec li:last-child {
                padding: 1rem 8% 1rem;
                }

body.products .contents .about_products .buy_ec li a {
                display: block;
                /*height: 5em;*/
                background-size: auto 2.2em;
                background-repeat: no-repeat;
                background-position: 23% center;
                background-color: #fff;
                border: 5px solid #ededed;
	box-sizing: border-box;
                /*padding-left: 2em*/
                padding: 1em 0;
                }

body.products .contents .about_products .buy_ec li a p {
                display: inline-block;
                padding-left: 0;
                background-image: url("../img/shopping-cart.svg");
                background-position: center top;
	background-repeat: no-repeat;
                background-size: 1.2em;
                /*letter-spacing: .05em;*/
                padding: 2.2em 0 0;
                }

body.products .contents .about_products .buy_ec li a:hover p{
                border-bottom: none;
                text-decoration: underline;
                }


/*
body.products .contents .about_products .buy_ec li.rktn a {
                background-image: url("../img/icn_rktn.png")
                }

body.products .contents .about_products .buy_ec li.pypy a {
                background-image: url("../img/icn_pypy.png")
                }

body.products .contents .about_products .buy_ec li.amzn a {
                background-image: url("../img/icn_amzn.png")
                }
*/

@media screen and (min-width: 600px) {
body.products .contents .about_products .inner .slider {
                max-width: 490px;
                margin: 0 auto
                }
body.products .contents .about_products .inner .txt .ttl3 .ja {
                font-size: 1.3rem
                }
body.products .contents .about_products .inner .txt .ttl3 .en {
                font-size: 2.4rem
                }
body.products .contents .about_products .inner .txt .detail, body.products .contents .about_products .inner .txt .color {
                font-size: 1.3rem
                }
body.products .contents .about_products .inner .txt .note {
                font-size: 1.1rem;
                line-height: 1.8em
                }
body.products .contents .about_products .buy_ec {
                display: block;
                }
body.products .contents .about_products .buy_ec li {
                flex-grow: 1;
                /*border-right: 1px solid #dedede;*/
                /*height: 7em;*/
                }
body.products .contents .about_products .buy_ec li:last-of-type {
                border-right: none
                }
body.products .contents .about_products .buy_ec li:last-child {
                }
body.products .contents .about_products .buy_ec li a {
                /*padding-left: 2.5em;*/
                background-position: 10% center;
                /*height: 5em;*/
                }
                }

@media screen and (min-width: 900px) {
body.products .contents .about_products {
                margin-bottom: 4em
                }
body.products .contents .about_products .inner {
                display: flex;
                align-items: center;
                justify-content: space-between;
                padding-bottom: 4em
                }
body.products .contents .about_products .inner .slider {
                width: 46%;
                max-width: 490px;
                padding-bottom: 0
                }
body.products .contents .about_products .inner .txt {
                width: 38%;
                max-width: 460px;
                padding-bottom: 1em
                }
body.products .contents .about_products .inner .txt .ttl3 {
                text-align: left
                }
body.products .contents .about_products .inner .txt .ttl3 .ja {
                font-size: 1.3rem
                }
body.products .contents .about_products .inner .txt .ttl3 .en {
                font-size: 2.4rem
                }
body.products .contents .about_products .inner .txt .detail, body.products .contents .about_products .inner .txt .color {
                font-size: 1.3rem
                  }
body.products .contents .about_products .buy_ec li {
                /*height: 7em;*/
                line-height: 1em;
                padding: 2rem 1rem;
                width: 24%;
                display: inline-block;
                padding: 2rem .5rem;
                }
body.products .contents .about_products .buy_ec li:last-child {
                padding: 2rem .5rem;
                }
body.products .contents .about_products .buy_ec li a {
                /*padding-left: 4em;*/
                margin: 0 auto;
                /*height: 7em;*/
                background-position: 25% center
                }
                }

body.products .contents .about_products .buy_ec li a p {
                padding-left: 0;
                background-size: 1.5em;
                }

body.products .contents .feature .ttl2 {
                padding-bottom: 1.5em;
                padding-top: 1em
                }

body.products .contents .feature .txt .detail {
                padding-bottom: 2em
                }

body.products .contents .feature .ttl3 {
                font-size: 1.4rem;
                text-align: center;
                padding-top: 1em
                }

body.products .contents .feature .ttl4 {
                padding-bottom: 0.5em
                }

body.products .contents .feature .units {
                display: flex;
                flex-direction: column
                }

body.products .contents .feature .unit {
                padding-bottom: 2.5em
                }

body.products .contents .feature .unit .img {
                padding-bottom: 1em
                }

body.products .contents .feature .unit .img img {
                width: 100%;
                }

body.products .contents .feature .unit .txt {
                line-height: 1.8em
                }

body.products .contents .feature .unit .txt .ttl4 {
                color: #111
                }

body.products .contents .feature .unit .txt .detail {
                padding-bottom: 0;
                padding-top: 0
                }

body.products .contents .feature .add {
                border: 1px solid #dedede;
                padding: 1.5em 1.5em 0
                }

body.products .contents .feature .add .ttl2 {
                padding-top: 1em;
                padding-bottom: 0
                }

body.products .contents .feature .add .txt .detail {
                padding-bottom: 0;
                padding-top: 1em
                }

body.products .contents .feature .add .set {
                border-bottom: 1px solid #dedede;
                padding-bottom: 2.5em;
                margin-bottom: 1em
                }

body.products .contents .feature .add .set:last-of-type {
                border-bottom: none;
                padding-bottom: 1.5em;
                margin-bottom: 0
                }

body.products .contents .feature .add .set .txt .note {
                font-size: 1.2rem;
                line-height: 1.8em;
                text-align: center;
                display: block;
                color: #888
                }

body.products .contents .feature .add .set .txt .detail {
                padding-top: 1em
                }

body.products .contents .feature .add .set .units {
                padding-bottom: 0
                }

body.products .contents .feature .add .set .unit {
                padding-bottom: 0
                }

body.products .contents .feature .add .set .unit:last-of-type {
                padding-bottom: 0
                }

body.products .contents .feature .add .set .unit .img {
                padding-top: 2em;
                padding-bottom: 0;
                }

body.products .contents .feature .add .set .unit .txt {
                text-align: left
                }

body.products .contents .feature .add .set .unit .ttl4 {
                padding-top: 1em;
                padding-bottom: 0
                }

body.products .contents .feature .add .set .unit .detail {
                padding-top: 0.5em
                }

body.products .contents .feature .add .set.single .txt .detail {
                text-align: left
                }

body.products .contents .feature .add .set.single .unit img {
                padding-bottom: 0
                }

@media screen and (min-width: 600px) {
body.products .contents .feature .unit .txt {
                font-size: 1.3rem
                }
body.products .contents .feature .add .set .txt .ttl3 {
                font-size: 1.8rem
                }
                }

@media screen and (min-width: 900px) {
body.products .contents .feature .ttl2 {
                padding-bottom: 1em
                }
body.products .contents .feature .txt {
                padding-bottom: 2.5em
                }
body.products .contents .feature .txt .detail {
                text-align: center;
                font-size: 1.4rem;
                padding-bottom: 1;
                padding-top: 1em
                }
body.products .contents .feature .units {
                flex-direction: row;
                padding-bottom: 4em
                }
body.products .contents .feature .unit {
                margin-right: 3em;
                flex-grow: 1;
                flex-shrink: 1;
                flex: 1;
                width: 100%;
                max-width: 700px;
                padding-bottom: 0
                }
body.products .contents .feature .unit:last-of-type {
                margin-right: 0
                }
body.products .contents .feature .unit .txt {
                padding-bottom: 0
                }
body.products .contents .feature .unit .txt .ttl4 {
                padding-bottom: 0.6em
                }
body.products .contents .feature .unit .txt .detail {
                text-align: inherit;
                font-size: inherit
                }
body.products .contents .feature .add {
                padding: 2.5em 3.5em 3.5em
                }
body.products .contents .feature .add .txt {
                text-align: center;
                padding-bottom: 0
                }
body.products .contents .feature .add .txt .ttl2 {
                padding-top: 1em
                }
body.products .contents .feature .add .txt .detail {
                padding-top: 2em
                }
body.products .contents .feature .add .set {
                margin-bottom: 0em
                }
body.products .contents .feature .add .set:last-of-type {
                margin-bottom: 0;
                padding-bottom: 0
                }
body.products .contents .feature .add .set .ttl3 {
                padding-top: 2em
                }
body.products .contents .feature .add .set .units {
                width: 100%
                }
body.products .contents .feature .add .set .unit {
                max-width: 100%
                }
body.products .contents .feature .add .set.single {
                display: flex;
                flex-direction: row-reverse;
                align-items: center;
                justify-content: space-between
                }
body.products .contents .feature .add .set.single .txt {
                padding-top: 3em
                }
body.products .contents .feature .add .set.single .ttl3 {
                text-align: left;
                padding-top: 0
                }
body.products .contents .feature .add .set.single .units, body.products .contents .feature .add .set.single .txt {
                width: calc(50% - 1.5em)
                }
body.products .contents .feature .add .set.single .unit .txt {
                padding-top: 0
                }
body.products .contents .feature .add .set.single .img {
                padding: 3em 0 0.5em
                }
body.products .contents .feature .add .set.single .txt {
                text-align: left
                }
body.products .contents .feature .add .set.imgl .units {
                justify-content: center
                }
                }

body.products .contents .option {
                background: #f5f5f5;
                padding: 3em 0 2em;
                margin-top: 2.5em
                }

body.products .contents .option .ttl2 {
                padding-bottom: 2.5em
                }

body.products .contents .option .unit {
                background: #fff;
                margin-bottom: 1em
                }

body.products .contents .option .unit a {
                display: flex;
                align-items: center;
                justify-content: center;
                background: url(../img/arrow_k_r.svg) no-repeat 95% center;
                background-size: 10px auto;
                padding: 1em 0
                }

body.products .contents .option .unit .img {
                width: 25%
                }

body.products .contents .option .unit .txt {
                width: 65%;
                padding-right: 10%;
                color: #888;
                line-height: 1.8em
                }

@media screen and (min-width: 600px) {
body.products .contents .option {
                margin-top: 4.5em
                }
body.products .contents .option .ttl2 {
                padding-bottom: 2em
                }
body.products .contents .option .units {
                display: flex;
                flex-wrap: wrap
                }
body.products .contents .option .units .unit {
                width: calc((100% - 2em) / 2);
                margin-right: 2em
                }
body.products .contents .option .units .unit:nth-of-type(2n) {
                margin-right: 0
                }
                }

@media screen and (min-width: 900px) {
body.products .contents .option {
                padding: 4em 0 1em
                }
body.products .contents .option .units {
                display: flex;
                flex-wrap: wrap
                }
body.products .contents .option .units .unit {
                width: calc((100% - 6em) / 3);
                margin-right: 3em;
                margin-bottom: 2em
                }
body.products .contents .option .units .unit:nth-of-type(2n) {
                margin-right: 3em
                }
body.products .contents .option .units .unit:nth-of-type(3n) {
                margin-right: 0
                }
                }

body.products .contents .spec {
                padding: 4em 0 0em
                }

body.products .contents .spec table {
                width: 100%;
                font-size: 1.2rem;
                line-height: 2em;
                margin-bottom: 3em;
                border: none
                }

body.products .contents .spec table:first-of-type {
                margin-bottom: 0
                }

body.products .contents .spec table:first-of-type tr:last-of-type {
                border-bottom: 1px solid #dedede
                }

body.products .contents .spec tr {
                border-bottom: 1px solid #dedede;
                display: flex;
                flex-direction: column;
                padding-bottom: 0.9em;
                margin-bottom: 0.9em
                }

body.products .contents .spec tr td {
                flex-basis: 100%;
                width: 100% !important;
                flex-grow: 1
                }

body.products .contents .spec tbody, body.products .contents .spec td {
                border: none
                }

body.products .contents .spec .btn a {
                width: 290px;
                margin: 0 auto
                }

@media screen and (min-width: 600px) {
body.products .contents .spec {
                padding-top: 6em
                }
body.products .contents .spec .inner {
                max-width: 700px
                }
body.products .contents .spec table {
                font-size: 1.3rem
                }
body.products .contents .spec tr {
                flex-direction: row;
                align-items: center;
                line-height: 1.8em;
                padding-bottom: 1.5em;
                margin-bottom: 1.5em
                }
body.products .contents .spec tr td {
                width: 70% !important
                }
body.products .contents .spec tr td:first-of-type {
                width: 30% !important;
                padding-left: 2em;
                flex-grow: 3;
                flex-basis: 30%
                }
body.products .contents .spec tr td:last-of-type {
                padding-right: 2em;
                flex-grow: 7;
                flex-basis: 70%
                }
                }

@media screen and (min-width: 900px) {
body.products .contents .spec .inner {
                max-width: 700px
                }
body.products .contents .spec .ttl2 {
                padding-bottom: 3em
                }
body.products .contents .spec table {
                font-size: 1.3rem
                }
body.products .contents .spec .btn a {
                margin: 0 auto 2em
                }
                }


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

news .contents

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

body.news .contents {
                padding-top: 1em
                }

body.news .contents .ttl_unit {
                font-size: 1.5rem;
                line-height: 1.6em;
                padding: 1em 0 2em;
                color: #555
                }

body.news .contents .detail {
                padding-bottom: 1em
                }

body.news .contents .detail p {
                padding-bottom: 2em
                }

body.news .contents .btn a {
                margin: 0 auto
                }

@media screen and (min-width: 600px) {
body.news .contents .date {
                font-size: 1.3rem
                }
body.news .contents .ttl_unit {
                font-size: 1.8rem
                }
                }

@media screen and (min-width: 900px) {
body.news .contents {
                padding-top: 5em
                }
body.news .contents .ttl_unit {
                padding-bottom: 3em
                }
body.news .contents .detail {
                padding-bottom: 2em
                }
body.news .contents .btn a {
                margin: 0 auto 2em
                }
                }

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

topics .contents

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

body.topics .contents {
                padding-top: 1rem
                }

body.topics .contents .ttl_unit {
                font-size: 1.5em;
                line-height: 1.7em;
                padding: 0 0 3rem;
                }
@media screen and (min-width: 600px) {
body.topics .contents .ttl_unit {
                font-size: 2em;
                }
                }

body.topics .contents .main {
                padding: 1rem 0 1rem;
                }

body.topics .contents .detail {
                margin-top: 2rem;
                padding-bottom: 1rem;
                padding-top: 3rem;
                border-top: 1px solid #bbb;
                }

body.topics .contents .detail p {
                font-size: 1.2em;
                line-height: 1.8em;
                padding: 0 0 2rem 0;
                }

body.topics .contents .detail p img{
                border: 1px solid #e0e0e0;
                margin: 1.5rem 0;
                }

body.topics .contents .btn {
                margin-top: 6rem;
                }

body.topics .contents .btn a {
                margin: 0 auto
                }

@media screen and (min-width: 600px) {
body.topics .contents .date {
                font-size: 1.3rem
                }
body.topics .contents .ttl_unit {
                font-size: 2.5rem
                }
                }

@media screen and (min-width: 900px) {
body.topics .contents .btn a {
                margin: 0 auto 2em
                }
body.topics .contents .btn {
                margin-top: 8rem;
                }
                }

body.topics .contents .detail h1{
                font-size: 1.5em;
                padding: 2rem 0;
                color: #000;
                }

body.topics .contents .detail h2{
                font-size: 1.4em;
                padding: 2rem 0;
                color: #000;
                }

body.topics .contents .detail h3{
                font-size: 1.3em;
                padding: 2rem 0;
                color: #000;
                }

body.topics .contents .detail h4{
                font-size: 1.2em;
                padding: 2rem 0;
                color: #000;
                }

body.topics .contents hr{
                margin: 3rem 0;
	opacity: 0.5;
	filter: alpha(opacity=50);
                }


body.topics .contents .mt-be-columns{
                column-gap: 0;
                flex-direction: column;
                }
@media screen and (min-width: 600px) {
body.topics .contents .mt-be-columns{
                column-gap: 3rem;
                flex-direction: row;
                }
                }

body.topics .contents .mt-be-columns p{
                padding-bottom: 0;
                }


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

support

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

body.support .contents .contents_upper {
                background: #f5f5f5;
                padding: 2.2em 0
                }

body.support .contents .ttl2 {
                text-align: center;
                line-height: 1.8em;
                padding-bottom: 1.2em
                }

body.support .contents .ttl2 .en {
                font-size: 2.1rem
                }

body.support .contents .ttl2 .ja {
                font-size: 1.4rem;
                color: #888
                }

body.support .contents .ttl3 {
                font-size: 1.6rem;
                text-align: center;
                padding-bottom: 1.5em
                }

body.support .contents .units {
                margin-bottom: 2em
                }

body.support .contents .unit {
                margin-bottom: 1px;
                padding: 0 0
                }

body.support .contents .unit a {
                border-bottom: none;
                text-decoration: underline
                }

body.support .contents .unit a:hover {
                border-bottom: none;
                text-decoration: none
                }

body.support .contents .unit .ttl_unit {
                font-size: inherit;
                line-height: 1.4em;
                color: #555;
                height: 75px;
                display: flex;
                align-items: center;
                background: #fff url("../img/arrow_open.svg") no-repeat calc(100% - 1em) center;
                padding: 0 3em 0 1em;
                background-size: 10px
                }

body.support .contents .unit .ttl_unit:hover {
                cursor: pointer
                }

body.support .contents .unit .ttl_unit::before {
                content: 'Q';
                font-size: 1.5rem;
                padding-right: 0.8em
                }

body.support .contents .unit .ttl_unit.open {
                background-image: url("../img/arrow_close.svg")
                }

body.support .contents .unit .detail {
                padding: 1.5em 3em 0.5em 1em;
                display: none;
                background: #fff;
                margin-top: 1px;
                color: #555
                }

body.support .contents .unit .detail::before {
                content: 'A';
                font-size: 1.5rem;
                padding-right: 1em;
                visibility: hidden
                }

body.support .contents .unit .detail p {
                padding-bottom: 1em
                }

body.support .contents .unit .detail.open {
                display: flex
                }

body.support .contents .contents_bottom {
                padding: 3em 0 0
                }

body.support .contents .contents_bottom .txt {
                padding-bottom: 2em
                }

body.support .contents .contents_bottom .btn a {
                width: 100%;
                font-size: 1.2rem;
                max-width: 290px;
                margin: 0 auto
                }

@media screen and (min-width: 600px) {
body.support .contents .unit .ttl_unit {
                padding: 0 2em 0 1.5em;
                background-position: calc(100% - 1.5em) center
                }
body.support .contents .unit .ttl_unit::before {
                font-size: 1.8rem
                }
body.support .contents .unit .detail {
                padding: 1.5em 2em 0.5em 1.5em
                }
body.support .contents .unit .detail::before {
                font-size: 1.8rem
                }
                }

@media screen and (min-width: 900px) {
body.support .contents .contents_upper {
                padding: 3.2em 0
                }
body.support .contents .ttl2 {
                padding-bottom: 2.2em
                }
body.support .contents .unit .ttl_unit {
                padding: 0 3em 0 2em;
                background-position: calc(100% - 2em) center
                }
body.support .contents .unit .detail {
                padding: 2em 3em 1em 2em
                }
body.support .contents .contents_bottom {
                padding: 4em 0 0;
                text-align: center
                }
body.support .contents .contents_bottom .txt {
                padding-bottom: 3em
                }
                }


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

privacy

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

body.privacy .ttl {
                text-align: left;
                padding-bottom: 1em;
                line-height: 1.8em
                }

body.privacy .ttl h1 {
                font-size: 1.8rem;
                padding: 3em 0 2.5em
                }

body.privacy .contents {
                padding-bottom: 2em;
                line-height: 1.8em
                }

body.privacy .contents .unit {
                border-bottom: 1px solid #dedede
                }

body.privacy .contents .unit:last-of-type {
                border-bottom: none;
                padding-bottom: 4em
                }

body.privacy .contents .unit .txt {
                padding-bottom: 2em
                }

body.privacy .contents .unit .ja {
                font-size: 1.3rem;
                padding: 2em 0 1.5em
                }

body.privacy .contents .sign {
                text-align: right;
                padding-bottom: 2em
                }

@media screen and (min-width: 600px) {
body.privacy .ttl h1 {
                font-size: 2.1rem
                }
body.privacy .contents .unit .ja {
                font-size: 1.4rem
                }
                }

@media screen and (min-width: 900px) {
body.privacy .ttl {
                padding-bottom: 0
                }
body.privacy .ttl h1 {
                font-size: 2.1rem;
                padding: 4em 0 3.5em
                }
body.privacy .contents {
                padding-bottom: 6em
                }
body.privacy .contents .unit:last-of-type {
                padding-bottom: 2em
                }
body.privacy .contents .unit .ja {
                font-size: 1.4rem
                }
                }

/*------------------------
body.topicslist
--------------------------*/

body.topicslist .contents .column {
                width: 100%;
                margin: auto;
                padding: 0 0 3.5em;
                }

body.topicslist .contents .column .innner{
	width: 92%;
                margin: auto;
                display: flex;
                justify-content: flex-start;
                flex-wrap: wrap;
                flex-direction: row;
                }
@media screen and (min-width: 600px) {
body.topicslist .contents .column .innner{
                width: 90%;
                margin: auto;
                }
                }
@media screen and (min-width: 900px) {
body.topicslist .contents .column .innner{
                width: 80%;
                max-width: 1300px;
                }
                }

body.topicslist .contents .column .unit_item {
                width: 50%;
                margin-bottom: 1em;
                display: flex;
                flex-direction: column;
                text-align: left;
                padding: 0 3%;
                }
@media screen and (min-width: 600px) {
body.topicslist .contents .column .unit_item {
                width: 33.33%;
                margin-bottom: 2em;
                }
                }
@media screen and (min-width: 900px) {
body.topicslist .contents .column .unit_item {
                width: 33.33%;
                margin-bottom: 2em;
                }
                }

body.topicslist .contents .column .unit_item a {
                display: flex;
                flex-direction: column;
                width: 100%;
                height: 100%;
                border-bottom: 1px solid transparent
                }

body.topicslist .contents .column .unit_item a:hover {
                border-bottom: 1px solid transparent
                }

body.topicslist .contents .column .unit_item .img {
                margin-bottom: .6rem
                }

body.topicslist .contents .column .unit_item .img img {
                width: 100%
                }

body.topicslist .contents .column .unit_item h2{
                padding: 0 1rem;
                }

body.topicslist .contents .column .unit_item .day {
                color: #555;
                font-size: 1.3rem;
                line-height: 1.6em;
                margin: 1em 0 1em;
                }

body.topicslist .contents .column .unit_item .ja {
                color: #555;
                font-size: 1.3rem;
                line-height: 1.6em;
                margin: 1em 0 1em;
                }
@media screen and (min-width: 900px) {
body.topicslist .contents .column .unit_item .ja {
                font-size: 1.5rem;
                line-height: 1.6em;
                margin: 1em 0 1em;
	text-align: justify;
	text-justify: inter-ideograph;
                }
                }

body.topicslist .contents .column .unit_item a:hover .ja:nth-child(2) {
                text-decoration: underline;
                }

/*------------------------
コラム
--------------------------*/

.unit_article .video {
                position: relative;
                width:100%;
                height:0;
                padding-top: 56.25%;
                }

.unit_article .video iframe{
                position: absolute;
                top: 0;
                left: 0;
                width: 100%;
                height: 100%;
                }

/*------------------------
extra
--------------------------*/

.max50{
                max-width: 100%;
                }
@media screen and (min-width: 900px) {
.max50{
                display: block;
                margin: auto;
                max-width: 50%;
                }
                }

/*--------------------------
アコーディオン
--------------------------*/

#accordion .openbtn .btn{
                padding-top: 2rem;
	}

#abox{
	display: none;
	}

#abox .openbtn a{
	pointer-events: none;
	}


.openshow{
	display: block !important;
	}

.ac .news{
                padding-top: 0 !important;
	}


/*--------------------------
注意書き
--------------------------*/

body.products .contents .plus_caution {
                border: 1px solid #FF7474;
                padding: 1em 1.5em 0;
                color: #ff6666 !important;
                }

body.products .contents .plus_caution .txt{
                padding-bottom: 0;
                }

body.products .contents .plus_caution h2.ttl2{
                font-size: .9em;
                padding-bottom: 1em;
                color: #ff3333 !important;
                }

body.products .contents .plus_caution .detail{
	padding-top: 0em !important;
                }

body.products .contents .plus_caution p{
                font-size: .8em;
	text-indent:-1em;
	padding-left:1em;
                line-height: 1.8em;
                }
body.products .contents .plus_caution p:before {
	content: '・';
	}


/*--------------------------
固定EC
--------------------------*/

.oec {
                position: fixed;
                top: 10px;
                right: 10px;
                }
.oec a{
                display: block;
                width: 100%;
                height: 100%;
                background-color: #e7e7e7;
	box-sizing: border-box;
                padding-bottom: 1px;
                background-image: url(../img/shopping-cart.svg);
                background-position: left 7px center;
                background-repeat: no-repeat;
                background-size: .9em;
                }
.oec span{
                color: #888;
                font-size: .85em;
                padding: 0 .6em 0 2.2em;
                }
@media screen and (min-width: 600px) {
.oec {
                top: 15px;
                }
                }
@media screen and (min-width: 900px) {
.oec {
                display: none;
                }
                }