@charset "utf-8";
/*----------------------header---------------------------------------*/
body {font-family: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", "Meiryo", "Osaka", "ＭＳ Ｐゴシック", "MS P Gothic", Verdana, Arial, Helvetica, sans-serif; font-size: 12px; margin: 0; overflow: visible; padding: 0;}

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



/* TOPナビゲーション */
.top-nav {background-color: #fff; border-bottom: 3px solid #a4a4a4; display: block; margin: 0 auto; padding-top: 2px; position: fixed; width: 100%; z-index: 9999;}
.top-nav .ttl-sec {margin: 0 auto; width: 960px;}
.top-nav .ttl-sec h1 {color: #C0B6B5; font-size: 10px; font-weight: normal; margin: 0; padding-bottom: 7px;}
.top-nav .ttl-sec p.ttl {color: #C0B6B5; font-size: 10px; font-weight: normal; margin: 0; padding-bottom: 7px;}
.top-nav .ttl-sec h1.top,
.top-nav .ttl-sec .main-ttl {float: left; font-size:0; padding-right: 38px; padding-top:6px; width: 218px;}
.top-nav .ttl-sec .search-con {float: left; margin-top: 10px; width: 475px;}
.top-nav .ttl-sec .search-con form {background-color: #fff; border: none; float: right; width: 473px;}
.top-nav .ttl-sec .search-con form:before, 
.top-nav .ttl-sec .search-con form:after{content: ""; display: table; line-height: 0;}

.top-nav .ttl-sec .search-con form input {border: 1px solid #c3c3c3; border-radius: 0; box-shadow: none; color: #666; height: 25px; line-height: 20px; margin-right: 0; padding: 4px; vertical-align: middle; width: 388px;}
.top-nav .ttl-sec .search-con form button {border: 0; border-radius: 0; cursor: pointer; display: block; float: right; height: 35px; margin-bottom: 0; overflow: hidden; padding: 0; text-shadow: none; vertical-align: middle; width: 75px;}
.top-nav .ttl-sec .search-con form button img {height: 35px; width: 75px;}
.top-nav .ttl-sec .search-con form button:hover{ opacity:0.6; -moz-opacity: 0.6; filter: alpha(opacity=60);}

.top-nav .nav-btn {height: 55px; margin: 9px auto 0; width: 960px;}
.top-nav .nav-btn ul {border-left: 1px solid #a4a4a4; display: table; table-layout: fixed; width: 100%;}
.top-nav .nav-btn ul li {border-right: 1px solid #a4a4a4; display: table-cell; text-align: center; vertical-align: middle;}
.top-nav .nav-btn ul .img {font-size: 0; line-height: 0; }

.top-nav .nav-btn ul li a {
  box-shadow: 0 0 1px transparent;
  color: #373737;
  display: block;
  font-family: "游ゴシック Medium", "Yu Gothic Medium", "游ゴシック体", YuGothic, "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", "Meiryo", "Osaka", "ＭＳ Ｐゴシック", "MS P Gothic", Verdana, Arial, Helvetica, sans-serif;
  font-size: 16px;
  font-weight: bold;
  height: 23px;
  padding: 16px 0;
  position: relative;
  text-decoration: none;
  -webkit-transform: perspective(1px) translateZ(0);
  transform: perspective(1px) translateZ(0);
  -webkit-transition-property: color;
  transition-property: color;
  -webkit-transition-duration: 0.2s;
  transition-duration: 0.2s;
  width: 100%;
}
.top-nav .nav-btn ul li.uservoice a {}
.top-nav .nav-btn ul .img a {height: 55px; padding: 0;}
.top-nav .nav-btn ul li a:before {
  background: #ffe9e8;
  bottom: 0;
  content: "";
  left: 0;
  position: absolute;
  right: 0;
  top: 0;
  -webkit-transform: scaleY(0);
  transform: scaleY(0);
  -webkit-transform-origin: 50% 100%;
  transform-origin: 50% 100%;
  -webkit-transition-property: transform;
  transition-property: transform;
  -webkit-transition-duration: 0.2s;
  transition-duration: 0.2s;
  -webkit-transition-timing-function: ease-out;
  transition-timing-function: ease-out;
  z-index: -1;
}

.top-nav .nav-btn ul li a:hover, 
.top-nav .nav-btn ul li a:focus {
  color: #373737;
}

.top-nav .nav-btn ul li a:hover:before, 
.top-nav .nav-btn ul li a:focus:before, 
.top-nav .nav-btn ul li a:active:before {
  -webkit-transform: scaleY(1);
  transform: scaleY(1);
}

.top-nav .nav-btn ul li a.current-page {color: #faa;}

.top-nav .nav-btn ul li a:active,
.top-nav .nav-btn ul li a.current-page:hover, 
.top-nav .nav-btn ul li a.current-page:focus, 
.top-nav .nav-btn ul li a.current-page:active {
  color: #f88;
}

.top-nav .sub-nav {float: right; width: 200px;}
.top-nav .sub-nav p {float: left; font-size: 0; line-height: 0; width: 60px;}
.top-nav .sub-nav p.catalogues {padding-left:10px;}
.top-nav .sub-nav p.staffblog {float: right;}
.top-nav .sub-nav p a {display: block;}
.top-nav .sub-nav p a:hover {opacity: 0.6; -moz-opacity: 0.6; filter: alpha(opacity=60);}



/* フッター */
footer {border-top: 1px solid #c3c3c3; margin-top: 30px; width: 100%;}
footer .innder-box {margin: 0 auto; padding: 32px 0 48px; width: 960px;}
footer .innder-box .p-mark {margin: 0 auto 0; width: 745px;}
footer .innder-box .p-mark .icon,
footer .innder-box .p-mark .txt {display: -moz-inline-box; display: inline-block; /display: inline; vertical-align: bottom; /zoom: 1;}
footer .innder-box .p-mark .icon {width: 76px;}
footer .innder-box .p-mark .txt {color: #afafaf; padding-bottom: 3px; width: 669px;}

footer .innder-box .links {color: #afafaf; margin-top: 42px; text-align: center;}
footer .innder-box .links p {display: -moz-inline-box; display: inline-block; /display: inline; padding: 0 12px; width: 11em; vertical-align: middle; /zoom: 1;}
footer .innder-box .links p a {color: #afafaf; font-size: 11px; text-decoration: none;}
footer .innder-box .links p a:hover {text-decoration: underline;}
footer .innder-box .links .company {text-align: right;}
footer .innder-box .links .terms {text-align: left;}
footer .innder-box .links .contact {display: block; margin: 15px auto 0; text-align: center;}

footer .innder-box .copy {margin: 30px 0 0; text-align: center;}
footer .innder-box .copy img,
footer .innder-box .copy span {display: -moz-inline-box; display: inline-block; /display: inline; vertical-align: middle; /zoom: 1;}
footer .innder-box .copy img {margin: 0 9px 4px 0; width: 64px;}
footer .innder-box .copy span {color: #c9caca;}



/* 左メニュー */
.contents {margin: 30px auto 0; width: 960px;}
.contents.mt0 {margin-top: 0px; padding-top:146px;}
.contents .side-menu {float: left; width: 270px;}
.contents .side-menu menu {
  margin: 0;
  -webkit-padding-start: 0;
  padding-start: 0; padding:0;
  padding-inline-start: 0px;
}
.contents .side-menu menu h2 {font-size: 0; line-height: 0; margin: 0; padding: 0;}
.contents .side-menu menu ul li {border-bottom: 1px solid #c3c3c3; padding-left: 1px;}
.contents .side-menu menu .img-ver ul li,
.contents .side-menu menu .img-ver ul li a {font-size: 0; line-height: 0;}
.contents .side-menu menu ul li a {border-left: 7px solid; display: block; margin: 6px 0px 6px 0px;}
.contents .side-menu menu img {border: 0;}

.contents .side-menu menu ul li a {
  box-shadow: 0 0 1px transparent;
  position: relative;
  -webkit-transition-duration: 0.4s;
  transition-duration: 0.4s;
  -webkit-transform: perspective(1px) translateZ(0);
  transform: perspective(1px) translateZ(0);
  -webkit-transition-property: color;
  transition-property: color;
}

.contents .side-menu menu ul li a:before {
  bottom: 0;
  content: "";
  left: 0;
  position: absolute;
  right: 0;
  -webkit-transform: scaleX(0);
  transform: scaleX(0);
  -webkit-transition-duration: 0.4s;
  transition-duration: 0.4s;
  -webkit-transform-origin: 0 50%;
  transform-origin: 0 50%;
  -webkit-transition-property: transform;
  transition-property: transform;
  -webkit-transition-timing-function: ease-out;
  transition-timing-function: ease-out;
  top: 0;
  z-index: -1;
}

.contents .side-menu menu ul .marriage a {border-color: #FF75AB;}
.contents .side-menu menu ul .engage a {border-color: #4CBDEA;}
.contents .side-menu menu ul .set a {border-color: #F9CE00;}
.contents .side-menu menu ul .area a {border-color: #c497fc;}
.contents .side-menu menu ul .basic a {border-color: #ffc295;}
.contents .side-menu menu ul .blog a {border-color: #00c7fc;}
.contents .side-menu menu ul .ranking a {border-color: #9cfbdc;}

.contents .side-menu menu ul .marriage a:before {background: #FF75AB;}
.contents .side-menu menu ul .engage a:before {background: #4CBDEA;}
.contents .side-menu menu ul .set a:before {background: #F9CE00;}
.contents .side-menu menu ul .area a:before {background: #c497fc;}
.contents .side-menu menu ul .basic a:before {background: #ffc295;}
.contents .side-menu menu ul .blog a:before {background: #00c7fc;}
.contents .side-menu menu ul .ranking a:before {background: #9cfbdc;}

.contents .side-menu menu ul li a:hover, 
.contents .side-menu menu ul li a:focus, 
.contents .side-menu menu ul li a:active {color: #676668;}
.contents .side-menu menu ul li a:hover:before, 
.contents .side-menu menu ul li a:focus:before, 
.contents .side-menu menu ul li a:active:before {-webkit-transform: scaleX(1); transform: scaleX(1);}

.contents .side-menu menu .text-ver ul li a {color: #676668; font-size: 21px; letter-spacing: 0.05em; line-height: 1.3; padding: 10px 0 10px 20px; text-decoration: none;}
.contents .side-menu menu .text-ver ul li a.bold {font-weight: bold;}

.contents .side-menu menu .know {margin-top: 50px;}

.contents .side-menu .line-block {margin-top: 15px; }
.contents .side-menu .fb-block {margin-top: 15px; }



/* ページトップへ */
div.tothetopfixed {
  bottom: 20px;
  position: fixed;
  right: 15px;
  z-index: 1500;
}
 
div.tothetopfixed a {
  border-radius: 5px;
  color: #333333;
  display: block;
  font-size: 0.8em;
  margin: 0;
  opacity: 0.6;
  -moz-opacity: 0.6;
  filter: alpha(opacity=60);
}
 
div.tothetopfixed a:hover {
  color: #ffffff;
  opacity: 1.0;
  -moz-opacity: 1.0;
  filter: alpha(opacity=100);
}





/* TOPページ
----------------------------------------------------------------- */

/* TOPカルーセル */
header {background-color: #ffddcc; padding-top: 127px; width: 100%;}
header .o-flow {margin: 0 auto; max-width: 1280px; min-width: 960px; position: relative;}
header .o-flow .white-base{background-color: #fff;}
header .slider.thumb-item,
header .slider.thumb-item-nav {display: -moz-inline-box; display: inline-block; /display: inline; /zoom: 1; vertical-align: top;}
header .slider.thumb-item {width: 67.1875%;}
header .slider.thumb-item-nav {width: 32.8125%;}
header .slider.thumb-item-nav p {border: 0; border-bottom: 1px solid #ccc; font-size: 0; line-height: 0;}

header .slider.thumb-item-nav .slick-prev {position: static; transform: translate(0, 0); width: 100%;}
header .slider.thumb-item-nav .slick-next {position: static; transform: translate(0, 0); width: 100%;}
header .slider.thumb-item-nav .slick-prev::before,
header .slider.thumb-item-nav .slick-next::before {font-size: 0;}

header .slider.thumb-item-nav p:hover,
header .pk-border:hover {cursor: pointer;}
header .pk-border {background: url('/images/topBanner/arrow_current.png') no-repeat 8px center; border: 4px solid #faa; display: none; left: 67.1875%; position: absolute;}

.thumb-item {display: none;}


/* 右メインカラム */
.contents .main-column {float: right; width: 670px;}
/*
.contents .main-column h2 {font-size: 0; line-height: 0;}
*/
.contents .main-column h2 {border-bottom: 2px solid #fb9a97; font-family: "游ゴシック Medium", "Yu Gothic Medium", "游ゴシック体", YuGothic, "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", "Meiryo", "Osaka", "ＭＳ Ｐゴシック", "MS P Gothic", Verdana, Arial, Helvetica, sans-serif; font-size: 28px; line-height: 1.1; margin: 0; padding: 0 0 10px;}
.contents .main-column .more-link { border: 1px solid #fba19e; margin-top: 10px; text-align: center;}
.contents .main-column .more-link a {color: #fba19e; display: block; font-size: 14px; font-weight: bold; padding: 12px 0; text-decoration: none;}
.contents .main-column .more-link a:hover {text-decoration: underline;}
.contents .main-column .more-link a:hover {background-color: #fffafa;}


/* 特集 */
.contents .main-column .future {margin-top:20px;}
.contents .main-column .future .linkslider {margin-top: 15px;}
.contents .main-column .future .linkslider .bxslider dl dt {font-size: 0; line-height: 0;}
.contents .main-column .future .linkslider .bxslider dl dd {color: #afafaf; font-size: 19px; margin-top: 5px; }
.contents .main-column .future .linkslider .bx-wrapper {margin-bottom: 47px;}
.contents .main-column .future .linkslider .bx-wrapper .bx-controls .bx-controls-direction {display: none;}
.contents .main-column .future .linkslider .bx-wrapper .bx-pager.bx-default-pager a {margin: 0 8px;}
.contents .main-column .future .linkslider ul li dl dt a:hover img {filter: alpha( opacity=75 ); opacity: 0.75; -moz-opacity: 0.75;}
.contents .main-column .future .linkslider .bx-wrapper .bx-wrapper .bx-pager, .bx-wrapper .bx-controls-auto {bottom: -25px;}


/* 3カラム */
.contents .main-column .column3 {margin-top: 15px;}
.contents .main-column .column3 ul li {display: -moz-inline-box; display: inline-block; /display: inline; margin-left: 20px; vertical-align: top; width: 210px; /zoom: 1;}
.contents .main-column .column3 ul li:first-child {margin-left: 0px;}


/* 2カラム */
.contents .main-column .column2 ul li {display: -moz-inline-box; display: inline-block; /display: inline; margin-left: 16px; vertical-align: top; width: 327px; /zoom: 1;}
.contents .main-column .column2 ul li:first-child {margin-left: 0px;}
.contents .main-column .column2 ul li p {position: relative;}
.contents .main-column .column2 ul li p a {text-decoration: none;}
.contents .main-column .column2 ul li p a:hover {filter: alpha( opacity=75 ); opacity: 0.75; -moz-opacity: 0.75;}
.contents .main-column .column2 ul li p .main {display: block; font-size: 0; line-height: 0;}
.contents .main-column .column2 ul li p .txt {bottom: 15px; left: 12px; position: absolute; text-shadow: 1px 0px 0px #000000, 0px 1px 0px #000000, -1px 0px 0px #000000, 0px -1px 0px #000000; width: 303px;}
.contents .main-column .column2 ul li p .txt .vcatch {border-bottom: 1px solid #fff; color: #fff; display: block; font-size: 11.5px; margin-bottom: 4px; padding-bottom: 4px;}
.contents .main-column .column2 ul li p .txt .vname {color: #bbb5b7; display: block; font-size: 10px;}


/* おすすめブランド */
.contents .main-column .recom-brand .column3 ul li a:hover {filter: alpha( opacity=75 ); opacity: 0.75; -moz-opacity: 0.75;}
.contents .main-column .recom-brand .column3 ul li .img a,
.contents .main-column .recom-brand .column3 ul li .img a span {display: block; font-size: 0; line-height: 0;}
.contents .main-column .recom-brand .column3 ul li .txt {background: url('/images/index/bg_recom-brand_dashed.gif') repeat-x left top; color: #afafaf; font-size: 15px; padding-top: 7px;}


/* 新着情報 */
.contents .main-column .whats-new {margin-top: 20px;}
.contents .main-column .whats-new .datasec ul li {border-bottom: 1px solid #c3c3c3; padding: 16px;}
.contents .main-column .whats-new .datasec ul li.icon-none {padding-left: 68px;}
.contents .main-column .whats-new .datasec ul li .new-icon {background-color: #fba19e; color: #fff; font-size: 12px; padding: 7px 0; text-align: center; width: 52px;}
.contents .main-column .whats-new .datasec ul li .date {color: #afafaf; font-size: 15px; padding-left: 10px; width: 130px;}
.contents .main-column .whats-new .datasec ul li .main-txt {width: 446px;}
.contents .main-column .whats-new .datasec ul li .main-txt a {color: #414141; font-size: 17px; line-height: 1.3; text-decoration: none;}
.contents .main-column .whats-new .datasec ul li .main-txt a:hover {text-decoration: underline;}
.contents .main-column .whats-new .datasec ul li .new-icon,
.contents .main-column .whats-new .datasec ul li .date,
.contents .main-column .whats-new .datasec ul li .main-txt {display: -moz-inline-box; display: inline-block; /display: inline; /zoom: 1; line-height: 1.3; vertical-align: middle;}
.contents .main-column .whats-new .datasec ul li .no-fair {color: #414141; font-size: 17px; line-height: 1.3; text-decoration: none;}
.contents .main-column .whats-new .datasec ul li:hover {background-color: #fffafa;}


/* ブログ */
.contents .main-column .blog {margin-top: 20px;}
.contents .main-column .blog .column3 ul li .img {position: relative;}
.contents .main-column .blog .column3 ul li .img .new-icon {background-color: #fba19e; color: #fff; font-size: 12px; font-weight: normal; left: 2px; padding: 7px 13px; position: absolute; text-align: center; top: 16px;}


/* 結婚指輪の基礎知識 */
.contents .main-column .basic {margin-top: 20px;}


/* ブログ・基礎知識共通 */
.contents .main-column .type-a01 .column3 ul li .img a {color: #414141; display: block; font-weight: bold; text-decoration: none;}
.contents .main-column .type-a01 .column3 ul li .img a:hover {filter: alpha( opacity=75 ); opacity: 0.75; -moz-opacity: 0.75; text-decoration: underline; }
.contents .main-column .type-a01 .column3 ul li .img a .main {display: block; font-size: 0; line-height: 0;}
.contents .main-column .type-a01 .column3 ul li .img a .lead {display: block; font-size: 13.1px; line-height: 1.6; padding: 0.3em 0;}
.contents .main-column .type-a01 .column3 ul li .txt {background-color: #f2f2f2; }
.contents .main-column .type-a01 .column3 ul li .txt .ttl {border-bottom:1px solid #f9b5b4; font-size:12px; font-weight:bold; line-height:1.1; padding: 0.4em 0.6em;}
.contents .main-column .type-a01 .column3 ul li .txt .text {
  -webkit-box-orient: vertical;
  display: -webkit-box;
  font-size: 12px;
  height: 4.5em;
  -webkit-line-clamp: 3;
  line-height: 1.6;
  overflow: hidden;
  padding: 5px;
  width: 200px;
}


/* 購入者の声 */
.contents .main-column .uservoice {margin-top: 20px;}
.contents .main-column .uservoice .column2 {margin-top: 15px;}


/* パンくず用 */
#breadcrumbs {color: #666666; font-size: 90%; margin: 0 auto; width: 960px;}
#breadcrumbs ol li {display: inline;}
#breadcrumbs ol li:before {content: " > ";}
#breadcrumbs ol li:first-child:before {content: "";}
#breadcrumbs a{font-size:14px; color: #585858;}
#breadcrumbs a:hover{color: #787878;}
#breadcrumbs p{color: #666666;display:inline;}



/* プライバシーポリシー */
#privacy-policy * {font-family: "游ゴシック Medium", "Yu Gothic Medium", "游ゴシック体", YuGothic, "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", "Meiryo", "Osaka", "ＭＳ Ｐゴシック", "MS P Gothic", Verdana, Arial, Helvetica, sans-serif; font-size: 15px;}
#privacy-policy {margin-top: 20px;}
#privacy-policy .ttl {display: none;}
#privacy-policy dl dt {border-bottom: 1px solid #ccc; font-weight: bold; margin: 0.8em 0 0.3em;}
#privacy-policy dl .num {padding-left: 1.3em; text-indent: -1.3em;}
#privacy-policy dl dd ol li {padding-left: 2.3em; text-indent: -2.3em;}
#privacy-policy dl dd .indent1w li {padding-left: 1em; text-indent: -1em;}
#privacy-policy .txt-over {margin-top: 10px;}

/* サイト利用規約 */
#site-policy * {font-family: "游ゴシック Medium", "Yu Gothic Medium", "游ゴシック体", YuGothic, "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", "Meiryo", "Osaka", "ＭＳ Ｐゴシック", "MS P Gothic", Verdana, Arial, Helvetica, sans-serif; font-size: 15px;}
#site-policy {margin-top: 20px;}
#site-policy .ttl {display: none;}
#site-policy dl dt {border-bottom: 1px solid #ccc; font-weight: bold; margin: 0.8em 0 0.3em;}
#site-policy dl .num {padding-left: 1.05em; text-indent: -1.05em;}
#site-policy dl dd ol li {padding-left: 2.3em; text-indent: -2.3em;}
#site-policy dl dd .indent1w li {padding-left: 1em; text-indent: -1em;}
#site-policy .txt-over {margin-top: 10px;}