@charset "UTF-8";
/*==========================
font
==========================*/
@import url("https://use.typekit.net/iyj3bcd.css");

/*==========================
common
==========================*/
body {width: 100%;color: #000;font-family: var(--font-ZenOld);line-height: 1.6;word-wrap: break-word;-moz-osx-font-smoothing: grayscale;}
#Contents {padding-bottom: 50px;}
.breadcrumbBlock {background-color: #fff;}
#breadcrumb {display: flex;align-items: center;width: 100%;margin: 0 auto;}
#breadcrumb li {font-family: 'Hiragino Kaku Gothic ProN','Hiragino Sans', Meiryo, sans-serif !important;/* color: #CECECE; */color: #1C1C1C;letter-spacing: .05em;}
#breadcrumb li.currentPage {color: #1C1C1C;}

/*==========================
common existing
==========================*/
ol, ul {list-style: none;}
#contentsMain.existing {font-size: 15px;}
#contentsMain.existing .textHeader {margin: 20px auto 20px;text-align: center;}
#contentsMain.existing .textHeader .pageTitle {font-family: "Crimson Text","Yu Mincho",YuMincho,serif;font-size: 20px;text-align: center;line-height: 1.2;}
#contentsMain.existing .textHeader .pageTitle .jpn {font-size: 16px;}
#contentsMain.existing .pageRules .contentWrapper {max-width: 890px;margin: 0 auto;padding: 0 15px}
#contentsMain.existing .pageRules .ruleArchive .ruleTitle {font-size: 20px;border-bottom: 1px solid #ccc;padding-bottom: 5px;margin-bottom: 20px;}
#contentsMain.existing .pageRules .ruleArchive .ruleHeadline {font-size: 14px;font-weight: bold;margin-bottom: 5px;}
#contentsMain.existing .pageRules .ruleArchive .ruleBlock:not(:last-child) {margin-bottom: 20px;}
#contentsMain.existing .pageRules .ruleArchive .ruleBlock a {display: inline-block;text-decoration: underline;word-break: break-all;}

/*==========================
company
==========================*/
#contentsMain.company .companyInfoInner h2 {font-family: minion-pro, serif;font-weight: 400;font-style: normal;letter-spacing: .05em;text-align: center;}
#contentsMain.company .companyInfoInner h3 {font-family: 'ヒラギノ明朝 ProN W3', 'HiraMinProN-W3', 'HG明朝E', 'ＭＳ Ｐ明朝', 'MS PMincho', 'MS 明朝', serif;letter-spacing: .05em;}
#contentsMain.company .companyInfoInner h3 span {color: #707070;font-family: minion-pro, serif;font-weight: 400;font-style: normal;letter-spacing: .05em;}
#contentsMain.company .companyInfo {border-top: 1px solid #EDEDED;}
#contentsMain.company .companyInfoInner .companyProfile .companyInfo li {font-family: 'Hiragino Kaku Gothic ProN','Hiragino Sans', Meiryo, sans-serif !important;line-height: 1.65;letter-spacing: .05em;border-bottom: 1px solid #EDEDED;}
#contentsMain.company .companyInfoInner .companyPhilosophy h5 {color: #6585B2;font-family: 'ヒラギノ明朝 ProN W3', 'HiraMinProN-W3', 'HG明朝E', 'ＭＳ Ｐ明朝', 'MS PMincho', 'MS 明朝', serif;letter-spacing: .05em;}
#contentsMain.company .companyInfoInner .companyPhilosophy p {font-family: 'Hiragino Kaku Gothic ProN','Hiragino Sans', Meiryo, sans-serif !important;line-height: 1.65;letter-spacing: .05em;}
#contentsMain.company .companyInfoInner .companyLastTxt {font-family: 'Hiragino Kaku Gothic ProN','Hiragino Sans', Meiryo, sans-serif !important;line-height: 1.8;letter-spacing: .05em;text-align: right;}
#contentsMain.company .aboutCompanyInner .aboutCompanyImg {display: flex;justify-content: center;}
#contentsMain.company .aquaprogramInner {text-align: center;}
#contentsMain.company .aquaprogramInner h3 {font-family: 'ヒラギノ明朝 ProN W3', 'HiraMinProN-W3', 'HG明朝E', 'ＭＳ Ｐ明朝', 'MS PMincho', 'MS 明朝', serif;line-height: 1.65;}
#contentsMain.company .aquaprogramInner p {font-family: 'Hiragino Kaku Gothic ProN','Hiragino Sans', Meiryo, sans-serif !important;line-height: 2.3;letter-spacing: .05em;}
#contentsMain.company .jwfInner .jpfTxtBlock {position: relative;}
#contentsMain.company .jwfInner .jpfTxtBlock h5 {color: #6585B2;font-family: 'ヒラギノ明朝 ProN W3', 'HiraMinProN-W3', 'HG明朝E', 'ＭＳ Ｐ明朝', 'MS PMincho', 'MS 明朝', serif;letter-spacing: .05em;}
#contentsMain.company .jwfInner .jpfTxtBlock p {font-family: 'Hiragino Kaku Gothic ProN','Hiragino Sans', Meiryo, sans-serif !important;line-height: 1.65;letter-spacing: .05em;  }
#contentsMain.company .jwfInner .jpfTxtBlock p span {display: inline-block;} 
#contentsMain.company .jwfInner .jpfTxtBlock p span a {text-decoration: underline;}

/*==========================
ranking
==========================*/
#contentsMain.ranking .rankingTitle {color: #1C1C1C;letter-spacing: .05em;text-align: center;}
#contentsMain.ranking .categoryList li {color: #B9B9B9;letter-spacing: .05em;}
#contentsMain.ranking .categoryList li.slick-current {color: #00235F;}/*font-weight: 600 !important;*/
#contentsMain.ranking .cardUnit-ranking {display: flex;flex-wrap: wrap;}
#contentsMain.ranking .cardUnit-ranking .card-ranking {position: relative;}
#contentsMain.ranking .cardUnit-ranking .card-ranking .itemList_imgarea {border: 1px solid #EDEDED;}
#contentsMain.ranking .cardUnit-ranking .card-ranking .rankNum {position: absolute;top: 0;left: 0;color: #fff;font-family: minion-pro, serif;font-weight: 400;font-style: normal;letter-spacing: .05em;text-align: center;background-color: #022363;z-index: 10;} 
#contentsMain.ranking .cardUnit-ranking .card-ranking .brandName {font-family: 'ヒラギノ明朝 ProN W3', 'HiraMinProN-W3', 'HG明朝E', 'ＭＳ Ｐ明朝', 'MS PMincho', 'MS 明朝', serif;letter-spacing: .05em;}
#contentsMain.ranking .cardUnit-ranking .card-ranking .itemName {font-family: 'Hiragino Kaku Gothic ProN','Hiragino Sans', Meiryo, sans-serif;}
#contentsMain.ranking .cardUnit-ranking .card-ranking .priceArea {color: #575757;font-family: 'Hiragino Kaku Gothic ProN','Hiragino Sans', Meiryo, sans-serif;letter-spacing: .05em;}

/*==========================
faq
==========================*/
#contentsMain.fq .fqTitle {color: #1C1C1C;font-family: minion-pro, serif;font-weight: 400;font-style: normal;letter-spacing: .05em;text-align: center;}
#contentsMain.fq .faqBlock {border-bottom: 1px solid #CECECE;}
#contentsMain.fq .faqBlock .faqBlock_heading {font-family: 'ヒラギノ明朝 ProN W3', 'HiraMinProN-W3', 'Noto Serif JP','HG明朝E', 'ＭＳ Ｐ明朝', 'MS PMincho', 'MS 明朝', serif;}
#contentsMain.fq .faqBlock .dropTitle {border-top: 1px solid #CECECE;}
#contentsMain.fq .dropTitle {display: flex;position: relative;cursor: pointer;}
#contentsMain.fq .accordionIcon {position: absolute;top: 50%;}
#contentsMain.fq .accordionIcon span {position: absolute;background-color: #575757;transition: all .2s;border-radius: 4px;-webkit-border-radius: 4px;-ms-border-radius: 4px;-moz-border-radius: 4px;-o-border-radius: 4px;}
#contentsMain.fq .accordionIcon span:nth-of-type(1) {transform: rotate(90deg);-webkit-transform: rotate(90deg);-moz-transform: rotate(90deg);-ms-transform: rotate(90deg);-o-transform: rotate(90deg);}
#contentsMain.fq .accordionIcon.active span:nth-of-type(1) {transform: rotate(0deg);-webkit-transform: rotate(0deg);-moz-transform: rotate(0deg);-ms-transform: rotate(0deg);-o-transform: rotate(0deg);}
#contentsMain.fq .accordionIcon span:nth-of-type(2) {transform: rotate(0deg);-webkit-transform: rotate(0deg);-moz-transform: rotate(0deg);-ms-transform: rotate(0deg);-o-transform: rotate(0deg);}
#contentsMain.fq .questionIcon {color: #B5B5B5;font-family: 'Hiragino Kaku Gothic ProN','Hiragino Sans', Meiryo, sans-serif;font-weight: 600;line-height: 1.4;}
#contentsMain.fq .dropTitleTxt {font-family: 'Hiragino Kaku Gothic ProN','Hiragino Sans', Meiryo, sans-serif;font-weight: 600;letter-spacing: .05em;}
#contentsMain.fq .subDrop .answerFlexBlock {display: flex;}
#contentsMain.fq .answerIcon {color: #FD9494;font-family: 'Hiragino Kaku Gothic ProN','Hiragino Sans', Meiryo, sans-serif;font-weight: 600;line-height: 1.4;}
#contentsMain.fq .subDrop p {font-family: 'Hiragino Kaku Gothic ProN','Hiragino Sans', Meiryo, sans-serif;line-height: 1.75;letter-spacing: .05em;}
#contentsMain.fq .subDrop p a {display: inline-block;text-decoration: underline;}
#contentsMain.fq .imgList {display: flex;flex-wrap: wrap;}
#contentsMain.fq .imgList li {border: 1px solid #CECECE;}

/*==========================
guide
==========================*/
#contentsMain.guide img {width: 100%;height: 100%;}
/* TOP */
#contentsMain.guide .guideTitle {color: #1C1C1C;font-family: minion-pro, serif;font-weight: 400;font-style: normal;letter-spacing: .05em;text-align: center;}
#contentsMain.guide h3 {font-family: 'Hiragino Kaku Gothic ProN','Hiragino Sans', Meiryo, sans-serif;font-weight: 600;letter-spacing: .05em;}
#contentsMain.guide ul.guideLinkList {display: flex;flex-wrap: wrap;}
#contentsMain.guide ul.guideLinkList li {font-family: 'Hiragino Kaku Gothic ProN','Hiragino Sans', Meiryo, sans-serif;line-height: 1.75;letter-spacing: .05em;}
/* 下層 */
#contentsMain.guide .guide_underLayerTitle {color: #1C1C1C;font-family: minion-pro, serif;font-weight: 400;font-style: normal;letter-spacing: .05em;text-align: center;}
#contentsMain.guide .guide_underLayerTitle span {font-family: 'ヒラギノ明朝 ProN W3', 'HiraMinProN-W3', 'HG明朝E', 'ＭＳ Ｐ明朝', 'MS PMincho', 'MS 明朝', serif;letter-spacing: .05em;}
#contentsMain.guide .guideContents {border-bottom: 1px solid #EDEDED;}
#contentsMain.guide h3 {font-family: 'ヒラギノ明朝 ProN W6', 'HiraMinProN-W6', 'HG明朝E', 'ＭＳ Ｐ明朝', 'MS PMincho', 'MS 明朝', serif;letter-spacing: .05em;}
#contentsMain.guide .guideText {font-family: 'Hiragino Kaku Gothic ProN','Hiragino Sans', Meiryo, sans-serif;line-height: 1.7;letter-spacing: .05em;}
#contentsMain.guide h4 {font-family: 'Hiragino Kaku Gothic ProN','Hiragino Sans', Meiryo, sans-serif;font-weight: 600;letter-spacing: .05em;}
#contentsMain.guide .listText {list-style-type: decimal}
#contentsMain.guide .listText li {font-family: 'Helvetica Neue', Arial, 'Hiragino Kaku Gothic ProN','Hiragino Sans', Meiryo, sans-serif;line-height: 1.75;letter-spacing: .05em;}
#contentsMain.guide .attentionText {background-color: #EFF6FC;}
#contentsMain.guide .attentionText h5 {color: #CC0000;font-family: 'Hiragino Kaku Gothic ProN','Hiragino Sans', Meiryo, sans-serif;letter-spacing: .05em;}
#contentsMain.guide .attentionText p {font-family: 'Hiragino Kaku Gothic ProN','Hiragino Sans', Meiryo, sans-serif;line-height: 1.65;letter-spacing: .05em;}
#contentsMain.guide .imageBlock li {background-color: #EAEAEA;}
#contentsMain.guide .sizeText {font-family: 'Hiragino Kaku Gothic ProN','Hiragino Sans', Meiryo, sans-serif;letter-spacing: .05em;}
#contentsMain.guide .attentionText_ringSize {font-family: 'Hiragino Kaku Gothic ProN','Hiragino Sans', Meiryo, sans-serif;line-height: 1.9;letter-spacing: .05em;}
#contentsMain.guide .ringSizeTableMain .tableFlex .tableBlock table {border: 1px solid #CDE2F4;}
#contentsMain.guide .ringSizeTableMain .tableFlex .tableBlock table tr {font-family: 'Hiragino Kaku Gothic ProN','Hiragino Sans', Meiryo, sans-serif;letter-spacing: .05em;border-bottom: 1px solid #EDEDED;}
#contentsMain.guide .ringSizeTableMain .tableFlex .tableBlock table tr:last-of-type {border-bottom: 0px;}
#contentsMain.guide .ringSizeTableMain .tableFlex .tableBlock table tr,#contentsMain.guide .ringSizeTableMain .tableFlex .tableBlock table tr th {width: 16.6rem;text-align: center;}
#contentsMain.guide .ringSizeTableMain .tableFlex .tableBlock table tr th {font-weight: 300;line-height: 3.3;background-color: #EFF6FC;}
#contentsMain.guide .ringSizeTableMain .tableFlex .tableBlock table tr td {line-height: 2.8;}
#contentsMain.guide .ringSizeTableMain .tableFlex .tableBlock table tr th:nth-of-type(2),
#contentsMain.guide .ringSizeTableMain .tableFlex .tableBlock table tr td:nth-of-type(2) {border-left: 1px solid #EDEDED;border-right: 1px solid #EDEDED;}

/*==========================
presentGuide
==========================*/
#contentsMain.presentGuide .presentGuideTitle {font-family: minion-pro, serif;font-weight: 400;font-style: normal;line-height: 1;letter-spacing: .05em;text-align: center;}
#contentsMain.presentGuide .mvTxt h2 {font-family: 'ヒラギノ明朝 ProN W3', 'HiraMinProN-W3', 'HG明朝E', 'ＭＳ Ｐ明朝', 'MS PMincho', 'MS 明朝', serif;letter-spacing: .05em;}
#contentsMain.presentGuide .mvTxt p {font-family: 'Hiragino Kaku Gothic ProN','Hiragino Sans', Meiryo, sans-serif;line-height: 2.15;letter-spacing: .05em;}
#contentsMain.presentGuide .presentGuide_brandList {display: flex;flex-wrap: wrap;}
#contentsMain.presentGuide .logo4c,#contentsMain.presentGuide .logocanal4c,
#contentsMain.presentGuide .logoeaudouce4c,#contentsMain.presentGuide .logocoflby4c,
#contentsMain.presentGuide .logo4chomme {margin: auto;}

/*************************************SP****************************************/
@media screen and ( max-width:767px ) {
    /*==========================
    common
    ==========================*/
    #contentsMain .pcOnly {display: none;}
    #breadcrumb {padding: calc(28*(100vw/750)) calc(20*(100vw/750));}
    #breadcrumb li {font-size: calc(22*(100vw/750));}
    #breadcrumb li span {margin: 0 calc(12*(100vw/750));}

    /*==========================
    common existing
    ==========================*/
    #contentsMain.existing .container {-webkit-box-orient: vertical;-webkit-box-direction: reverse;-ms-flex-flow: column-reverse nowrap;flex-flow: column-reverse nowrap;}
    #contentsMain.existing .textHeader {margin-bottom: 40px;}
    #contentsMain.existing .textHeader .pageTitle {font-size: 28px;}
    #contentsMain.existing .textHeader .pageTitle .jpn {font-size: 22px;}

    /*==========================
    company
    ==========================*/
    #contentsMain.company {padding: calc(110*(100vw/750)) 0;}
    #contentsMain.company .companyInfoInner {width: 100%;margin-top: calc(60*(100vw/750));}
    #contentsMain.company .companyInfoInner h2 {font-size: calc(56*(100vw/750));}
    #contentsMain.company .companyInfoInner h3 {margin-top: calc(80*(100vw/750));padding: 0 calc(20*(100vw/750));font-size: calc(40*(100vw/750));}
    #contentsMain.company .companyInfoInner h3 span {margin-left: calc(20*(100vw/750));font-size: calc(26*(100vw/750));}
    #contentsMain.company .companyInfoInner .companyProfile .companyInfo {width: calc(710*(100vw/750));margin: calc(40*(100vw/750)) auto 0;}
    #contentsMain.company .companyInfoInner .companyProfile .companyInfo li {padding: calc(40*(100vw/750)) 0;font-size: calc(26*(100vw/750));}
    #contentsMain.company .companyInfoInner .companyProfile .companyInfo li h4 {margin-bottom: calc(10*(100vw/750));font-weight: 600;}
    #contentsMain.company .companyInfoInner .googleMap {height: calc(400*(100vw/750));margin: calc(80*(100vw/750)) auto calc(160*(100vw/750));}
    #contentsMain.company .companyInfoInner .companyPhilosophy {padding: 0 calc(20*(100vw/750)) calc(30*(100vw/750));border-bottom: 1px solid #EDEDED;}
    #contentsMain.company .companyInfoInner .companyPhilosophy h3 {padding: 0 !important;}
    #contentsMain.company .companyInfoInner .companyPhilosophy h5 {margin-top: calc(40*(100vw/750));font-size: calc(32*(100vw/750));}
    #contentsMain.company .companyInfoInner .companyPhilosophy p {margin-top: calc(30*(100vw/750));font-size: calc(26*(100vw/750));}
    #contentsMain.company .companyInfoInner .companyLastTxt {margin-top: calc(30*(100vw/750));padding: 0 calc(20*(100vw/750));font-size: calc(24*(100vw/750));}
    #contentsMain.company .aboutCompanyInner .aboutCompanyImg {flex-direction: column; margin-top: calc(160*(100vw/750));}
    #contentsMain.company .aboutCompanyInner .aboutCompanyImg li {margin: calc(6*(100vw/750)) 0;}
    #contentsMain.company .aquaprogramInner .logoImg {width: calc(368*(100vw/750));margin: calc(160*(100vw/750)) auto 0;}
    #contentsMain.company .aquaprogramInner h3 {margin-top: calc(60*(100vw/750));font-size: calc(36*(100vw/750));}
    #contentsMain.company .aquaprogramInner p {margin-top: calc(52*(100vw/750));padding: 0 calc(20*(100vw/750));font-size: calc(26*(100vw/750));}
    #contentsMain.company .jwfInner {background-image: url(../company/img/aquaBgSp.jpg);background-repeat: no-repeat;background-size: 100%;background-position: 0 calc(42*(100vw/750));padding-top: calc(92*(100vw/750));}
    #contentsMain.company .jwfInner .jpfTxtBlock {width: calc(670*(100vw/750));height: calc(1160*(100vw/750));margin: calc(190*(100vw/750)) auto 0;background-color: #fff;padding: calc(80*(100vw/750)) calc(26*(100vw/750));}
    #contentsMain.company .jwfInner .jpfTxtBlock h5 {font-size: calc(32*(100vw/750));line-height: 1.65;}
    #contentsMain.company .jwfInner .jpfTxtBlock h5:nth-of-type(n+2) {margin-top: calc(60*(100vw/750));}
    #contentsMain.company .jwfInner .jpfTxtBlock p {margin-top: calc(30*(100vw/750));font-size: calc(26*(100vw/750));}
    #contentsMain.company .jwfInner .jwflogoImg {width: calc(126*(100vw/750));margin: calc(56*(100vw/750)) auto 0;}
    #contentsMain.company .moreBtn a {display: block;width: calc(460*(100vw/750));height: calc(90*(100vw/750));margin: calc(100*(100vw/750)) auto 0;color: #fff;font-family: 'ヒラギノ明朝 ProN W3', 'HiraMinProN-W3', 'HG明朝E', 'ＭＳ Ｐ明朝', 'MS PMincho', 'MS 明朝', serif;font-size: calc(26*(100vw/750));line-height: calc(90*(100vw/750));letter-spacing: .05em;text-align: center;background-color: #00235F;}

    /*==========================
    ranking
    ==========================*/
    #contentsMain.ranking {padding-top: calc(110*(100vw/750));}
    #contentsMain.ranking .rankingTitle {margin: calc(72*(100vw/750)) auto 0;font-size: calc(56*(100vw/750));}
    #contentsMain.ranking .categoryList {display: flex;justify-content: space-between;align-items: center;margin-top: calc(86*(100vw/750));}
    #contentsMain.ranking .categoryList li {padding: 0 calc(60*(100vw/750)) calc(10*(100vw/750));font-size: calc(30*(100vw/750));text-align: center;}
    #contentsMain.ranking .categoryList li.slick-current {border-bottom: 2px solid #022363}/*font-weight: 600 !important;*/
    #contentsMain.ranking .ranking-wrap {max-width: calc(710*(100vw/750));margin: calc(70*(100vw/750)) auto 0;}
    #contentsMain.ranking .cardUnit-ranking {justify-content: space-between;}
    #contentsMain.ranking .cardUnit-ranking .card-ranking {width: calc(345*(100vw/750));}
    #contentsMain.ranking .cardUnit-ranking .card-ranking:nth-of-type(n+3) {margin-top: calc(60*(100vw/750));}
    #contentsMain.ranking .cardUnit-ranking .card-ranking .itemList_imgarea {margin-bottom: calc(30*(100vw/750));}
    #contentsMain.ranking .cardUnit-ranking .card-ranking .rankNum {width: calc(60*(100vw/750));height: calc(60*(100vw/750));font-size: calc(36*(100vw/750));line-height: calc(60*(100vw/750));} 
    #contentsMain.ranking .cardUnit-ranking .card-ranking .brandName {margin-bottom: calc(20*(100vw/750));font-size: calc(26*(100vw/750));}
    #contentsMain.ranking .cardUnit-ranking .card-ranking .itemName {font-size: calc(26*(100vw/750));letter-spacing: .08em;}
    #contentsMain.ranking .cardUnit-ranking .card-ranking .priceArea {margin-top: calc(28*(100vw/750));font-size: calc(24*(100vw/750));}

    /*==========================
    faq
    ==========================*/
    #contentsMain.fq {margin-top: calc(112*(100vw/750));}
    #contentsMain.fq .fqTitle {margin: calc(30*(100vw/750)) auto 0;font-size: calc(56*(100vw/750));letter-spacing: .05em;}
    #contentsMain.fq .faqPageLinkBlock {position: relative;width: calc(710*(100vw/750));height: calc(90*(100vw/750));margin: calc(70*(100vw/750)) auto calc(80*(100vw/750));padding: 0 calc(24*(100vw/750));border: 1px solid #CECECE;font-family: 'Hiragino Kaku Gothic ProN','Hiragino Sans', Meiryo, sans-serif;font-size: calc(26*(100vw/750));letter-spacing: .05em;}
    #contentsMain.fq .faqPageLinkBlock::before {content: '';display: block;position: absolute;top: calc(30*(100vw/750));right: calc(30*(100vw/750));width: calc(20*(100vw/750));height: calc(20*(100vw/750));border-left: 1px solid #575757;border-bottom: 1px solid #575757;transform: rotate(-45deg);}
    #contentsMain.fq .faqPageLinkBlock select {width: 100%;height: 100%;}
    #contentsMain.fq .faqMain {padding: 0 calc(20*(100vw/750));}
    #contentsMain.fq .faqBlock {
			display: none;
			margin-bottom: calc(100*(100vw/750));
		}
		#contentsMain.fq .faqBlock_active{
			display: block;
		}
    #contentsMain.fq .faqBlock .faqBlock_heading {margin-bottom: calc(30*(100vw/750));font-size: calc(40*(100vw/750));line-height: 1.2;letter-spacing: .09rem;}
    #contentsMain.fq .dropTitle {padding: calc(30*(100vw/750)) calc(60*(100vw/750)) calc(30*(100vw/750)) 0;}
    #contentsMain.fq .accordionIcon {right: calc(20*(100vw/750));width: calc(26*(100vw/750));height: calc(26*(100vw/750));}
    #contentsMain.fq .accordionIcon span {width: calc(26*(100vw/750));height: calc(2*(100vw/750));}
    #contentsMain.fq .questionIcon {margin-right: calc(28*(100vw/750));font-size: calc(28*(100vw/750));font-weight: 600;line-height: 1.4;}
    #contentsMain.fq .dropTitleTxt {font-size: calc(27*(100vw/750));}
    #contentsMain.fq .subDrop {padding-bottom: calc(40*(100vw/750));}
    #contentsMain.fq .answerIcon {margin-right: calc(28*(100vw/750));font-size: calc(28*(100vw/750));}
    #contentsMain.fq .subDrop p {font-size: calc(26*(100vw/750));}
    #contentsMain.fq .imgList {justify-content: space-between;width: calc(710*(100vw/750));margin: calc(30*(100vw/750)) auto 0;}
    #contentsMain.fq .imgList li {width: calc(344*(100vw/750));height: calc(228*(100vw/750));}
    #contentsMain.fq .imgList li:nth-of-type(n+3) {margin-top: calc(14*(100vw/750));}

    /*==========================
    guide
    ==========================*/
    #contentsMain.guide {padding-top: calc(108*(100vw/750));}
    #contentsMain.guide .contentsInner {width: calc(710*(100vw/750));margin: 0 auto;}
    /* TOP */
    #contentsMain.guide .guideTitle {margin: calc(30*(100vw/750)) auto calc(70*(100vw/750));font-size: calc(56*(100vw/750));letter-spacing: .05em;}
    #contentsMain.guide h3 {font-size: calc(28*(100vw/750));}
    #contentsMain.guide ul.guideLinkList {margin: calc(30*(100vw/750)) auto calc(50*(100vw/750));padding-left: calc(10*(100vw/750));}
    #contentsMain.guide ul.guideLinkList li {width: calc(350*(100vw/750));padding-right: calc(30*(100vw/750));font-size: calc(24*(100vw/750));}
    #contentsMain.guide ul.guideLinkList li:nth-of-type(n+3) {margin-top: calc(30*(100vw/750));}
    /* 下層 */
    #contentsMain.guide .guide_underLayerTitle {margin: calc(60*(100vw/750)) auto calc(64*(100vw/750));font-size: calc(56*(100vw/750));line-height: 1.4;}
    #contentsMain.guide .guide_underLayerTitle span {font-size: calc(26*(100vw/750));}
    #contentsMain.guide .guideContents {padding-bottom: calc(120*(100vw/750)); }
    #contentsMain.guide h3 {margin-top: calc(60*(100vw/750));font-size: calc(36*(100vw/750));}
    #contentsMain.guide .guideText {margin-top: calc(20*(100vw/750));font-size: calc(26*(100vw/750));}
    #contentsMain.guide h4 {margin-top: calc(60*(100vw/750));font-size: calc(28*(100vw/750));}
    #contentsMain.guide .listText {margin-top: calc(26*(100vw/750));padding-left: calc(40*(100vw/750));}
    #contentsMain.guide .listText li {font-size: calc(26*(100vw/750));}
    #contentsMain.guide .attentionText {margin-top: calc(60*(100vw/750));padding: calc(60*(100vw/750)) calc(36*(100vw/750));}
    #contentsMain.guide .attentionText h5 {font-size: calc(26*(100vw/750));line-height: 1.65;}
    #contentsMain.guide .attentionText p {margin-top: calc(20*(100vw/750));font-size: calc(24*(100vw/750));}
    #contentsMain.guide .imageBlock {margin-top: calc(100*(100vw/750));}
    #contentsMain.guide .imageBlock li {width: calc(710*(100vw/750));height: calc(532*(100vw/750));}
    #contentsMain.guide .imageBlock li:nth-of-type(n+2) {margin-top: calc(20*(100vw/750));}
    #contentsMain.guide .ringSizeTableMain {margin-top: calc(80*(100vw/750));}
    #contentsMain.guide .sizeText {font-size: calc(24*(100vw/750));}
    #contentsMain.guide .tableBlock:nth-of-type(n+2) {margin-top: calc(40*(100vw/750));}
    #contentsMain.guide .ringSizeTableMain .tableFlex .tableBlock table {width: calc(710*(100vw/750));margin-top: calc(20*(100vw/750));}
    #contentsMain.guide .ringSizeTableMain .tableFlex .tableBlock table tr {font-size: calc(24*(100vw/750));border-bottom: 1px solid #EDEDED;}
    #contentsMain.guide .attentionText_ringSize {margin-top: calc(30*(100vw/750));font-size: calc(22*(100vw/750));}

    /*==========================
    presentGuide
    ==========================*/
    #contentsMain.presentGuide {padding-top: calc(108*(100vw/750));}
    #contentsMain.presentGuide .presentGuideTitle {margin: calc(60*(100vw/750)) auto calc(80*(100vw/750));font-size: calc(56*(100vw/750));}
    #contentsMain.presentGuide .mvTxt {margin-top: calc(70*(100vw/750));padding: 0 calc(20*(100vw/750));}
    #contentsMain.presentGuide .mvTxt h2 {font-size: calc(40*(100vw/750));}
    #contentsMain.presentGuide .mvTxt p {margin-top: calc(40*(100vw/750));font-size: calc(26*(100vw/750));}
    #contentsMain.presentGuide .presentGuide_brandList {width: calc(710*(100vw/750));margin: calc(140*(100vw/750)) auto 0;}
    #contentsMain.presentGuide .presentGuide_brandList li:nth-of-type(n+2) {margin-top: calc(120*(100vw/750));}
    #contentsMain.presentGuide .presentGuide_brandList li .brandImg {margin-bottom: calc(30*(100vw/750));}
    #contentsMain.presentGuide .logo4c {width: calc(80*(100vw/750));}
    #contentsMain.presentGuide .logocanal4c {width: calc(224*(100vw/750));}
    #contentsMain.presentGuide .logoeaudouce4c {width: calc(342*(100vw/750));}
    #contentsMain.presentGuide .logocoflby4c {width: calc(176*(100vw/750));}
    #contentsMain.presentGuide .logo4chomme {width: calc(202*(100vw/750));}

}
/*************************************PC****************************************/
@media screen and (max-width: 1400px) and (min-width: 768px) {html {font-size: calc(10* (100vw / 1400)) !important;}}
@media only screen and (min-width: 768px) {
    /*==========================
    common
    ==========================*/
    #Contents {padding-bottom: 13rem;}
    #contentsMain .spOnly {display: none;}
    #breadcrumb {max-width: 120rem;padding: 1.15rem 0;}
    #breadcrumb li {font-size: 1.1rem;}
    #breadcrumb li span {margin: 0 .5rem;}

    /*==========================
    common existing
    ==========================*/
    #contentsMain.existing .container {display: flex;-webkit-box-orient: vertical;-webkit-box-direction: reverse;-ms-flex-flow: column-reverse nowrap;flex-flow: column-reverse nowrap;}
    #contentsMain.existing .textHeader {margin-bottom: 40px;}
    #contentsMain.existing .textHeader .pageTitle {font-size: 28px;}
    #contentsMain.existing .textHeader .pageTitle .jpn {font-size: 22px;}
    #contentsMain.existing .pageRules .ruleArchive .ruleTitle {margin-bottom: 30px;padding-bottom: 10px;}
    #contentsMain.existing .pageRules .ruleArchive .ruleHeadline {margin-bottom: 10px;}
    #contentsMain.existing .pageRules .ruleArchive .ruleBlock:not(:last-child) {margin-bottom: 30px;}

    /*==========================
    common new
    ==========================*/

    /*==========================
    privacy.terms.law
    ==========================*/
    #contentsMain.privacy {padding-top: 6.2rem;}
    #contentsMain.terms {padding-top: 6.2rem;}
    #contentsMain.law {padding-top: 6.2rem;}

    /*==========================
    company
    ==========================*/
    #contentsMain.company {padding: calc(45*(100vw/1400)) 0;}
    #contentsMain.company .companyInfoInner {max-width: 90rem;width: 100%;margin: 5rem auto 0;padding: 0 5rem;}
    #contentsMain.company .companyInfoInner h2 {font-size: 3.2rem;}
    #contentsMain.company .companyInfoInner h3 {margin-top: 4.6rem;font-size: 2rem;}
    #contentsMain.company .companyInfoInner h3 span {margin-left: 1rem;font-size: 1.3rem;}
    #contentsMain.company .companyInfoInner .companyProfile .companyInfo {margin-top: 3rem;}
    #contentsMain.company .companyInfoInner .companyProfile .companyInfo li {display: flex;padding: 2rem 0;font-size: 1.3rem;}
    #contentsMain.company .companyInfoInner .companyProfile .companyInfo li h4 {width: 19rem;}
    #contentsMain.company .companyInfoInner .googleMap {width: 80rem;height: 25rem;margin: 4.6rem auto 10rem;}
    #contentsMain.company .companyInfoInner .companyPhilosophy {padding-bottom: 3rem;border-bottom: 1px solid #EDEDED;}
    #contentsMain.company .companyInfoInner .companyPhilosophy h5 {margin-top: 2rem;font-size: 1.6rem;}
    #contentsMain.company .companyInfoInner .companyPhilosophy p {margin-top: 2rem;font-size: 1.3rem;}
    #contentsMain.company .companyInfoInner .companyLastTxt {margin-top: 4rem;font-size: 1.2rem;}
    #contentsMain.company .aboutCompanyInner .aboutCompanyImg {margin-top: 12rem;padding: 0 5rem;}
    #contentsMain.company .aboutCompanyInner .aboutCompanyImg li {margin: 0 .3rem;overflow:hidden;}
    #contentsMain.company .aboutCompanyInner .aboutCompanyImg li img{transition:.5s all;}
    #contentsMain.company .aboutCompanyInner .aboutCompanyImg li img:hover{transform:scale(1.1,1.1);transition:.5s all;}
    #contentsMain.company .aquaprogramInner .logoImg {width: calc(202*(100vw/1400));margin: calc(120*(100vw/1400)) auto 0;}
    #contentsMain.company .aquaprogramInner h3 {margin-top: calc(36*(100vw/1400));font-size: calc(18*(100vw/1400));}
    #contentsMain.company .aquaprogramInner p {margin-top: calc(24*(100vw/1400));font-size: calc(13*(100vw/1400));}
    #contentsMain.company .jwfInner {background-image: url(../company/img/aquaBgPc.jpg);background-repeat: no-repeat;background-size: 100%;background-position: 0 calc(-110*(100vw/1400));padding-top: calc(150*(100vw/1400));}
    #contentsMain.company .jwfInner .jpfTxtBlock {width: calc(800*(100vw/1400));height: calc(375*(100vw/1400));margin: calc(90*(100vw/1400)) auto 0;background-color: #fff;padding: calc(50*(100vw/1400)) calc(40*(100vw/1400));}
    #contentsMain.company .jwfInner .jpfTxtBlock h5 {font-size: calc(16*(100vw/1400));}
    #contentsMain.company .jwfInner .jpfTxtBlock h5:nth-of-type(n+2) {margin-top: calc(40*(100vw/1400));}
    #contentsMain.company .jwfInner .jpfTxtBlock p {margin-top: calc(20*(100vw/1400));font-size: calc(13*(100vw/1400));}
    #contentsMain.company .jwfInner .jwflogoImg {position: absolute;right: calc(50*(100vw/1400));bottom: calc(50*(100vw/1400));width: calc(90*(100vw/1400));}
    #contentsMain.company .moreBtn a {display: block;width: calc(240*(100vw/1400));height: calc(44*(100vw/1400));margin: calc(50*(100vw/1400)) auto 0;color: #fff;font-family: 'ヒラギノ明朝 ProN W3', 'HiraMinProN-W3', 'HG明朝E', 'ＭＳ Ｐ明朝', 'MS PMincho', 'MS 明朝', serif;font-size: calc(13*(100vw/1400));line-height: calc(44*(100vw/1400));letter-spacing: .05em;text-align: center;background-color: #00235F;}

    /*==========================
    ranking
    ==========================*/
    #contentsMain.ranking {padding-top: 6rem;}
    #contentsMain.ranking .rankingTitle {margin: 4rem auto 0;font-size: 3.8rem;}
    #contentsMain.ranking .categoryList {display: flex;justify-content: space-between;align-items: center;width: 80rem;margin: 5rem auto 0;}
    #contentsMain.ranking .categoryList li {font-size: 2rem;}
    #contentsMain.ranking .categoryList li:hover {opacity: .8;cursor: pointer;}
    #contentsMain.ranking .rankingListBlock {display: none;}
    #contentsMain.ranking .ranking-wrap {max-width: 120rem;margin: 4rem auto 0;}
    #contentsMain.ranking .cardUnit-ranking .card-ranking {width: 22.2rem;margin-right: 2rem;}
    #contentsMain.ranking .cardUnit-ranking .card-ranking:nth-of-type(5n) {margin-right: 0;}
    #contentsMain.ranking .cardUnit-ranking .card-ranking:nth-of-type(n+6) {margin-top: 4rem;}
    #contentsMain.ranking .cardUnit-ranking .card-ranking .itemList_imgarea {margin-bottom: 1.5rem;}
    #contentsMain.ranking .cardUnit-ranking .card-ranking .rankNum {width: 3rem;height: 3rem;font-size: 1.8rem;line-height: 3rem;} 
    #contentsMain.ranking .cardUnit-ranking .card-ranking .brandName {margin-bottom: 1.1rem;font-size: 1.3rem;}
    #contentsMain.ranking .cardUnit-ranking .card-ranking .itemName {font-size: 1.3rem;letter-spacing: .05em;}
    #contentsMain.ranking .cardUnit-ranking .card-ranking .priceArea {margin-top: 1.5rem;font-size: 1.2rem;}

    /*==========================
    faq
    ==========================*/
    #contentsMain.fq {margin-top: 6.2rem;}
    #contentsMain.fq .fqTitle {margin: 4rem auto 0;font-size: 3.0rem;letter-spacing: .05em;}
    #contentsMain.fq .faqMain {display: flex;max-width: 100rem;width: 100%;margin: 4.6rem auto 0;}
    #contentsMain.fq .faqPageLinkBlock {position: relative;width: 21rem;}
    #contentsMain.fq .faqPageLinkBlock .faqPageLinkList {position: sticky;top: 10rem;padding-bottom: 5rem;}
    #contentsMain.fq .faqPageLinkBlock .faqPageLinkList li {position: relative;margin-bottom: 1.5rem;padding-left: 1.4rem;color: #1C1C1C;font-family: 'Hiragino Kaku Gothic ProN','Hiragino Sans', Meiryo, sans-serif;font-size: 1.3rem;line-height: 1.75;letter-spacing: .05em;cursor: pointer;}
    #contentsMain.fq .faqPageLinkBlock .faqPageLinkList li::before {content: '';display: block;position: absolute;top: .7rem;left: 0;width: .6rem;height: .6rem;border-top: 1px solid #1C1C1C;border-right: 1px solid #1C1C1C;transform: rotate(45deg);}
    #contentsMain.fq .faqPageLinkBlock .faqPageLinkList li.active {color: #6585B2;font-weight: 600;}
    #contentsMain.fq .faqPageLinkBlock .faqPageLinkList li.active::before {border-top: 1px solid #6585B2;border-right: 1px solid #6585B2;}
    #contentsMain.fq .faqBlock {
			display: none;
			margin-bottom: 5rem;
		}
		#contentsMain.fq .faqBlock_active{
			display: block;
		}
    #contentsMain.fq .answerBlock {width: 75rem;margin-left: auto;}
    #contentsMain.fq .faqBlock .faqBlock_heading {margin-bottom: 2rem;font-size: 2rem;line-height: 1;letter-spacing: .05em;}
    #contentsMain.fq .dropTitle {padding: 1.5rem 5rem 1.5rem 0;}
    #contentsMain.fq .accordionIcon {right: 2rem;width: 1.3rem;height: 1.3rem;}
    #contentsMain.fq .accordionIcon span {width: 1.3rem;height: .1rem;}
    #contentsMain.fq .questionIcon {margin-right: 1.5rem;font-size: 1.4rem;}
    #contentsMain.fq .dropTitleTxt {font-size: 1.4rem;}
    #contentsMain.fq .subDrop {padding: 1rem 0 2rem;}
    #contentsMain.fq .answerIcon {margin-right: 1.5rem;font-size: 1.4rem;}
    #contentsMain.fq .subDrop p {font-size: 1.3rem;}
    #contentsMain.fq .imgList {margin-top: 1.5rem;}
    #contentsMain.fq .imgList li {width: 18rem;height: 12rem;margin-right: 1rem;}
    #contentsMain.fq .imgList li:nth-of-type(4n) {margin-right: 0;}
    #contentsMain.fq .imgList li:nth-of-type(n+5) {margin-top: 1rem;}

    /*==========================
    guide
    ==========================*/
    #contentsMain.guide {padding-top: 6.2rem;}
    #contentsMain.guide .contentsInner {width: 100rem;margin: 0 auto;}
    /* TOP */
    #contentsMain.guide .guideTitle {margin: 4rem auto 6.6rem;font-size: 3.2rem;letter-spacing: .05em;}
    #contentsMain.guide h3 {font-size: 1.5rem;}
    #contentsMain.guide ul.guideLinkList {margin: 1rem auto 4rem;}
    #contentsMain.guide ul.guideLinkList li {width: 20rem;padding-right: 3rem;font-size: 1.3rem;}
    #contentsMain.guide ul.guideLinkList li:nth-of-type(n+6) {margin-top: 1rem;}
    /* 下層 */
    #contentsMain.guide .guide_underLayerTitle {margin: 4rem auto 3rem;font-size: 3.2rem;line-height: 1.4;}
    #contentsMain.guide .guide_underLayerTitle span {font-size: 1.3rem;}
    #contentsMain.guide .guideContents {padding-bottom: 5rem; }
    #contentsMain.guide h3 {margin-top: 3rem;font-size: 1.8rem;}
    #contentsMain.guide .guideText {margin-top: 2rem;font-size: 1.3rem;}
    #contentsMain.guide h4 {margin-top: 3rem;font-size: 1.5rem;}
    #contentsMain.guide .listText {margin-top: 1.5rem;padding-left: 2rem;}
    #contentsMain.guide .listText li {font-size: 1.3rem;}
    #contentsMain.guide .attentionText {margin-top: 2rem;padding: 2.2rem 3rem;}
    #contentsMain.guide .attentionText h5 {font-size: 1.3rem;}
    #contentsMain.guide .attentionText p {margin-top: 1rem;font-size: 1.2rem;}
    #contentsMain.guide .imageBlock {display: flex;justify-content: space-between;margin-top: 4rem;}
    #contentsMain.guide .imageBlock li {width: 49.3rem;height: 36.8rem;}
    #contentsMain.guide .ringSizeTableMain {margin-top: 1.5rem;}
    #contentsMain.guide .sizeText {font-size: 1.2rem;}
    #contentsMain.guide .ringSizeTableMain .tableFlex {display: flex;justify-content: space-between;}
    #contentsMain.guide .ringSizeTableMain .tableFlex .tableBlock table {width: 49.5rem;margin-top: .5rem;}
    #contentsMain.guide .ringSizeTableMain .tableFlex .tableBlock table tr {font-size: 1.2rem;border-bottom: 1px solid #EDEDED;}
    #contentsMain.guide .ringSizeTableMain .tableFlex .tableBlock table tr th {line-height: 3.3;}
    #contentsMain.guide .ringSizeTableMain .tableFlex .tableBlock table tr td {line-height: 2.8;}
    #contentsMain.guide .attentionText_ringSize {margin-top: .5rem;font-size: 1.1rem;}

    /*==========================
    presentGuide
    ==========================*/
    #contentsMain.presentGuide {padding-top: 6.2rem;}
    #contentsMain.new.presentGuide .breadcrumb {width: 124rem;}
    #contentsMain.presentGuide .presentGuideTitle {margin: 3.5rem auto 5rem;font-size: 3.2rem;}
    #contentsMain.presentGuide .mvBlock {position: relative;width: 120rem;margin: 0 auto;}
    #contentsMain.presentGuide .mvTxt {position: absolute;top: 11rem;right: 16.4rem;z-index: 10;}
    #contentsMain.presentGuide .mvTxt h2 {font-size: 2.5rem;}
    #contentsMain.presentGuide .mvTxt p {margin-top: 2rem;font-size: 1.3rem;}
    #contentsMain.presentGuide .presentGuide_brandList {width: 120rem;margin: 8rem auto 0;}
    #contentsMain.presentGuide .presentGuide_brandList li {width: 37rem;margin-right: 4.5rem;}
    #contentsMain.presentGuide .presentGuide_brandList li:nth-of-type(3n) {margin-right: 0;}
    #contentsMain.presentGuide .presentGuide_brandList li:nth-of-type(n+4) {margin-top: 5.5rem;}
    #contentsMain.presentGuide .presentGuide_brandList li .brandImg {margin-bottom: 2rem;}
    #contentsMain.presentGuide .logo4c {width: 4rem;}
    #contentsMain.presentGuide .logocanal4c {width: 11rem;}
    #contentsMain.presentGuide .logoeaudouce4c {width: 17rem;}
    #contentsMain.presentGuide .logocoflby4c {width: 8.7rem;}
    #contentsMain.presentGuide .logo4chomme {width: 11rem;}


}