@charset "UTF-8";


@import url('https://fonts.googleapis.com/css2?family=Zen+Old+Mincho:wght@500&display=swap');


span { line-height: 1 }
p { font-size: 16px; font-family: "dnp-shuei-gothic-gin-std", sans-serif; font-weight: 400; font-style: normal; }
.tx-white { color: #fff; }
.tx-grey { color: #acabac; }
.pl-50 { padding-left: 50%; }

.fdi { position: relative; opacity: 0; transform: translateY(4.4vw); transition: opacity 1.2s linear, transform 1s cubic-bezier(0.19, 1, 0.22, 1) }
.fdi .contrast { filter: contrast(300%); transition: 1.2s linear }
.fdi.active { opacity: 1; transform: translateY(0); }
.fdi.active .contrast { filter: contrast(100%); }

.main-vis { position: relative; opacity: 0; transition: opacity 1.2s linear, transform 1s cubic-bezier(0.19, 1, 0.22, 1)  }
.main-vis .pic { filter: contrast(300%); transition: 1.2s linear }
.main-vis.active { opacity: 1; }
.main-vis.active .pic  { filter: contrast(100%); }
.main-vis .main-vis-content { position: absolute; top: 20vw; left: 54.4vw; z-index: 10 }
.main-vis .main-vis-content .logo img { width: 25.2vw; }
.main-vis .main-vis-content .date { color: #fff; font-size: 1.32vw; font-weight: 100; letter-spacing: 0.24em; line-height: 1; padding: 1.47vw 0 2.9vw; }
.main-vis .main-vis-content h1 { color: #fff; font-size: 5.58vw; font-family: "linotype-didot", serif;
font-weight: 400; letter-spacing: 0.04em; line-height: 1; padding: 0 0 2.2vw; }
.main-vis .main-vis-content h2 { color: #fff; font-size: 1.3vw; font-weight: 400; letter-spacing: 0.24em; }
.main-vis .main-vis-content h2 span { font-size: 1vw; letter-spacing: 0.24em; }


.overview { padding: 6.6vw 4.4vw 0; }
.overview .overview-inner { position: relative; }
.overview .overview-content { width: 36vw; position: absolute; top: 6.6vw; left: calc(50% + 4.4vw); }
.overview .overview-content h2 { color: #fff; font-size: 1.8vw; font-family: "Zen Old Mincho", serif; font-weight: 500; margin: 0 0 2.5em; }
.overview .overview-content p { color: #fff; font-size: 1.1vw; }


.anchor-nav { padding: 2.6vw 4.4vw; }
.anchor-nav ul li:first-child { border-left: 1px solid #acabac; }
.anchor-nav ul li { float: left; width: 25%; text-align: center; border-right: 1px solid #acabac; box-sizing: border-box; }
.anchor-nav ul li a { font-size: 24px; font-family: "linotype-didot", serif;
font-weight: 400; line-height: 1; letter-spacing: 0.06em; padding: 7px 0; display: block; position: relative; }
.anchor-nav ul li a::after { position: absolute; content: ""; top: calc(50% - 4px); margin: 0 0 0 15px; width: 14px; height: 12px; background: url("../../img/special-feature/iconic-models/arw_anchor-link.png") no-repeat; background-size: contain; transition: all 0.2s; }
.anchor-nav ul li a:hover::after { top: calc(50% - 2px); }


.item-list li { margin: 11.7vw 0 0 0; }
.item-list li .item-header { position: relative; }
.item-list li .item-header h2 { font-size: 18px; letter-spacing: 0.24em; font-weight: 400; }
.item-list li .item-header h2 span { font-size: 48px; font-family: "linotype-didot", serif; font-weight: 400; letter-spacing: 0.24em; margin: 0 0 0.2em; display: block; }
.item-list li .item-header .num { font-size: 18px; font-family: "linotype-didot", serif; font-weight: 400; letter-spacing: 0.06em; }
.item-list li .item-header .num .tx-b { font-size: 8.8vw; letter-spacing: 0.06em; }
.item-list li h3 { font-size: 24px; font-family: "Zen Old Mincho", serif; font-weight: 500; letter-spacing: 0.08em; margin: 0 0 1em; }
.item-list li .item-body { padding: 0 4.4vw; }
.item-list li .item-body .inner { padding: 0 4.4vw; position: relative; }
.item-list li .txt-l { width: calc(50% - 3.3vw); margin: 0 3.3vw 0 0; }
.item-list li .txt-r { width: calc(50% - 3.3vw); margin: 0 0 0 3.3vw; }

.item-list li:nth-child(odd) .item-intro { border-left: 1px solid #acabac; padding: 11vw 8.8vw 3.6vw 4.4vw; margin: -7.3vw 0 0 4.4vw; position: relative; z-index: 2; }
.item-list li:nth-child(odd) .item-header h2 { position: absolute; bottom: 8.4vw; right: 8.8vw; }
.item-list li:nth-child(odd) .item-header .num { position: absolute; top: -3.8vw; left: 2.5vw; }
.item-list li:nth-child(even) .item-header h2 { border-bottom: 1px solid #acabac; }
.item-list li:nth-child(even) .item-header .pic img { width: 50%; }
.item-list li:nth-child(even) .item-intro { padding: 0 4.4vw; }

.item-list li:nth-child(1) .item-body { margin-top: 5.5vw; }
.item-list li:nth-child(1) .item-body .cfix { margin-top: 9.5vw; }
.item-list li:nth-child(1) .pic01 img { width: 46vw; position: absolute; top: -5vw; right: -4.4vw; }
.item-list li:nth-child(1) .pic02 { text-align: center; }
.item-list li:nth-child(1) .pic02 img { width: 62.2vw; padding: 4.4vw 0 3vw; }

.item-list li:nth-child(2) .item-header h2 { margin: 0 -5.1vw 3.6vw 0; padding: 4.4vw 0 0.8em 4.4vw; }
.item-list li:nth-child(2) .item-header .num { position: absolute; top: -4vw; right: 4.4vw; }
.item-list li:nth-child(2) .item-header .pic { text-align: right; }
.item-list li:nth-child(2) .item-header-inner { position: absolute; top: 0; left: 4.4vw; width: calc(50% - 4.4vw); }
.item-list li:nth-child(2) .item-body .cfix { margin-top: 5.8vw; }
.item-list li:nth-child(2) .pic01 img { width: 36.7vw; position: absolute; top: -30vw; left: -8.8vw; }
.item-list li:nth-child(2) .pic02 { text-align: center; }
.item-list li:nth-child(2) .pic02 img { width: 53vw; padding: 5vw 0 3.6vw; }

.item-list li:nth-child(3) .item-body { margin-top: 4vw; }
.item-list li:nth-child(3) .item-body .cfix { margin-top: 8.8vw; }
.item-list li:nth-child(3) .pic01 img { width: 44.8vw; position: absolute; top: -1.8vw; left: -4.4vw; }
.item-list li:nth-child(3) .pic02 { text-align: right; }
.item-list li:nth-child(3) .pic02 img { width: 47.7vw; margin: -11.7vw -8.8vw 3.6vw 0; }

.item-list li:nth-child(4) .item-header h2 { margin: 0 0 3.6vw -5.1vw; padding: 4.4vw 0 0.8em 9.5vw; }
.item-list li:nth-child(4) .item-header .num { position: absolute; top: -4vw; left: 2.5vw; }
.item-list li:nth-child(4) .item-header-inner { position: absolute; top: 0; right: 4.4vw; width: calc(50% - 4.4vw); }
.item-list li:nth-child(4) .item-body { margin-top: 2.9vw; }
.item-list li:nth-child(4) .item-body .cfix { margin-top: 7.3vw; }
.item-list li:nth-child(4) .pic01 img { width: 42vw; position: absolute; top: -35vw; right: -4.4vw; }
.item-list li:nth-child(4) .pic02 img { width: 62.5vw; margin: -3.6vw 0 4.7vw 4.4vw; }
.item-list li:nth-child(4) .cfix .txt-l { margin-top: -15vw; }


.item-spec { background: #efeeef; padding: 30px 35px; margin: 0 0 0 4.4vw; position: relative; }
.item-spec h4 { font-size: 16px; letter-spacing: 0.12em; margin: 0 0 0.4em; }
.item-spec p { font-size: 15px; padding: 0 300px 0 0; }
.item-spec .btn { position: absolute; top: calc(50% - 24px); right: 25px; }
.item-spec .btn a { position: relative; display: inline-block; font-size: 24px; line-height: 2em; font-weight: 500; width: auto; padding-right: 36px; white-space: nowrap; }
.item-spec .btn a:link,.item-spec .btn a:visited { text-decoration: underline }
.item-spec .btn a::after { position: absolute; content: ""; right: 2px; top: calc(50% - 4px); width: 14px; height: 8px; background: url("../../img/arw_link.png") no-repeat; background-size: contain; transition: all 0.2s; }
.item-spec .btn a:hover::after { right: 0; }


.top-collection .block-inner .head { padding: 8vw 4.4vw 3.2vw }

.footer { border-top: 1px solid #ebe9e4; padding: 4.8vw 0 0 !important; }
.footer .footer-links { text-align: center; padding: 0 0 3.6vw; }
.footer .footer-links { margin: 0 0 0 -14.5vw; }
.footer .footer-links li { display: inline-block; text-align: left; margin: 0 0 0 14.5vw; }
.footer .footer-links li span { font-size: 16px; margin: 0 0 0.4em; display: block; }
.footer .footer-links li a { position: relative; display: inline-block; font-size: 24px; line-height: 2em; font-weight: 500; width: auto; padding-right: 36px; white-space: nowrap; }
.footer .footer-links li a:link,.footer .footer-links li a:visited { text-decoration: underline }
.footer .footer-links li a::after { position: absolute; content: ""; right: 2px; top: calc(50% - 4px); width: 14px; height: 8px; background: url("../../img/arw_link.png") no-repeat; background-size: contain; transition: all 0.2s }
.footer .footer-links li a:hover::after { right: 0; }



@media screen and (max-width: 1024px) {
	
	.item-list li:nth-child(1) .pic01 img { position: absolute; top: -2vw; right: -4.4vw; }	
	.item-list li:nth-child(2) .item-body { margin-top: 6vw;  }
	.item-list li:nth-child(2) .item-body .txt-l:nth-child(2) { padding-left: calc(50% + 3.3vw); }
	.item-list li:nth-child(2) .pic01 img { position: absolute; top: -8vw; left: -8.8vw; }
	.item-list li:nth-child(3) .item-body { padding-bottom: 6vw; }	
	.item-list li:nth-child(3) .pic01 img {position: absolute; top: 4.4vw; left: -4.4vw; }
	.item-list li:nth-child(3) .pic02 img { margin: 0; position: absolute; bottom: -4vw; right: -4.4vw; }
	.item-list li:nth-child(4) .item-body { margin-top: 6vw; }
	.item-list li:nth-child(4) .item-body .txt-r.pl-50 { padding-left: 0; margin-left: 0;  }
	.item-list li:nth-child(4) .pic01 img { position: absolute; top: -12vw; right: -4.4vw; }
	.item-list li:nth-child(4) .pic02 img { margin: 0 0 4.7vw 4.4vw; }	
	.item-list li:nth-child(4) .cfix .txt-l { margin-top: 0; }
}



@media screen and (max-width: 820px) {
	
	.item-list li:nth-child(1) .pic01 img { position: absolute; top: 2vw; right: -4.4vw; }	
	.item-list li:nth-child(2) .pic01 img { position: absolute; top: 6vw; left: -8.8vw; }
	.item-list li:nth-child(3) .pic01 img {position: absolute; top: 12vw; left: -4.4vw; }
	.item-list li:nth-child(3) .pic02 img { margin: 0; position: absolute; bottom: 3vw; right: -4.4vw; }
	.item-list li:nth-child(4) .item-body { margin-top: 16vw; }
	.item-list li:nth-child(4) .pic01 img { position: absolute; top: 0; right: -4.4vw; }
	.item-list li:nth-child(4) .pic02 img { margin: 0 0 4.7vw 4.4vw; }	
	.footer .footer-links { margin: 0 0 0 -4.5vw; }
	.footer .footer-links li { display: inline-block; text-align: left; margin: 0 0 0 4.5vw; }
}


@media screen and (max-width: 780px) {
  
  p { font-size: 13px; }
  .pl-50 { padding-left: 0; }
  
  .main-vis .main-vis-content { position: absolute; top: 8vw; left: 8vw; }
  .main-vis .main-vis-content .logo img { width: 55vw; }
  .main-vis .main-vis-content .date { font-size: 12px; font-weight: 100; letter-spacing: 0.24em; line-height: 1; padding: 2vw 0 3vw; }
  .main-vis .main-vis-content h1 { font-size: 10.6vw; font-family: "linotype-didot", serif; padding: 0 0 2vw; }
  .main-vis .main-vis-content h2 { font-size: 12px; letter-spacing: 0.12em }
  .main-vis .main-vis-content h2 span { font-size: 9px; }
  
  .overview { padding: 12vw 4vw 0; }
  .overview .overview-inner { position: relative; }
  .overview .overview-content { width: 100%; position: relative; top: inherit; left: inherit; }
  .overview .overview-content h2 { color: #020102; font-size: 18px; margin: 1em 0; }
  .overview .overview-content p { color: #020102; font-size: 13px; }
  
  .anchor-nav { padding: 4vw 4vw 0; }
  .anchor-nav ul li:first-child { border-left: 1px solid #acabac; }
  .anchor-nav ul li { float: left; width: 25%; text-align: center; border-right: 1px solid #acabac; box-sizing: border-box; }
  .anchor-nav ul li a { font-size: 14px; font-family: "linotype-didot", serif; letter-spacing: 0.06em; padding: 7px 10px 7px 0; }
  .anchor-nav ul li a::after { position: absolute; content: ""; top: calc(50% - 4px); margin: 0 0 0 4px; width: 10px; height: 10px; background: url("../../img/special-feature/iconic-models/arw_anchor-link.png") no-repeat; background-size: contain; transition: all 0.2s; }
  .anchor-nav ul li a:hover::after { top: calc(50% - 2px); }
  
  .item-list li { margin: 16vw 0 0 0; }
  .item-list li .item-header h2 { font-size: 14px; letter-spacing: 0.18em; font-weight: 400; }
  .item-list li .item-header h2 span { font-size: 28px; }
  .item-list li .item-header .num { font-size: 13px; }
  .item-list li .item-header .num .tx-b { font-size: 14vw; color: #020202 }
  .item-list li h3 { font-size: 18px; letter-spacing: 0.08em; margin: 0 0 0.66em; }
  .item-list li .item-body { padding: 0 4vw; }
  .item-list li .item-body .inner { padding: 0 4vw; position: relative; }
  .item-list li .txt-l { width: 100%; margin: 0; }
  .item-list li .txt-r { width: 100%; margin: 0; }
  
  .item-list li:nth-child(odd) .item-intro { border-left: 1px solid #acabac; padding: 12vw 4vw 3vw 4vw; margin: -8vw 0 0 4vw; position: relative; z-index: 2; }
  .item-list li:nth-child(odd) .item-header h2 { position: absolute; bottom: inherit; right: inherit; top: 18vw; left: 8vw; }
  .item-list li:nth-child(odd) .item-header .num { position: absolute; top: -6vw; left: 4vw; }
  .item-list li:nth-child(even) .item-header h2 { border-bottom: 1px solid #acabac; }
  .item-list li:nth-child(even) .item-header .pic img { width: 100%; }
  .item-list li:nth-child(even) .item-header .num { position: absolute; top: -6vw; right: 4vw; }
  .item-list li:nth-child(even) .item-intro { padding: 0 4vw; }
  
  .item-list li:nth-child(1) .item-header .num { color: #acabac  }
  .item-list li:nth-child(1) .item-body { margin-top: 4vw; }
  .item-list li:nth-child(1) .item-body .cfix { margin-top: 8vw; }
  .item-list .fltL.txt-l.fltL { margin-bottom: 8vw }
  .item-list li:nth-child(1) .pic01 { text-align: right }
  .item-list li:nth-child(1) .pic01 img { width: 80vw; position: relative; top: inherit; right: -8vw; }
  .item-list li:nth-child(1) .pic02 { text-align: center; }
  .item-list li:nth-child(1) .pic02 img { width: 80vw; padding: 4vw 0; }
  
  .item-list li:nth-child(2) .item-intro { border-left: 1px solid #acabac; padding: 12vw 4vw 3vw 4vw; margin: -8vw 0 0 4vw; }
  .item-list li:nth-child(2) .item-header { padding-bottom: 64vw }
  .item-list li:nth-child(2) .item-header h2 { margin: 0 0 41.6vw; padding: 20vw 0 0 8vw; border-bottom: none }
  .item-list li:nth-child(2) .item-header-inner { position: absolute; top: 0; left: 0; width: 100%; }
  .item-list li:nth-child(2) .item-body .txt-l:nth-child(2) { padding-left: 0; }
  .item-list li:nth-child(2) .item-body .cfix { margin-top: 8vw; }
  .item-list li:nth-child(2) .pic01 img { width: 68vw; position: relative; top: inherit; left: -8vw; }
  .item-list li:nth-child(2) .pic02 img { width: 84vw; padding: 4vw 0; }
  
  .item-list li:nth-child(3) .item-header h2 { position: absolute; bottom: inherit; right: inherit; top: 15vw; left: 8vw; }
  .item-list li:nth-child(3) .item-body { margin-top: 4vw; }
  .item-list li:nth-child(3) .item-body .cfix { margin-top: 8vw; }
  .item-list li:nth-child(3) .pic01 img { width: 76vw; position: relative; top: inherit; left: -8vw; margin-bottom: 3vw }
  .item-list li:nth-child(3) .pic02 { text-align: right; }
  .item-list li:nth-child(3) .pic02 img { width: 80vw; margin: 0; position: relative; bottom: inherit; right: -8vw; }
  
  .item-list li:nth-child(4) .item-intro { border-left: 1px solid #acabac; padding: 12vw 4vw 3vw 4vw; margin: -8vw 0 0 4vw; }
  .item-list li:nth-child(4) .item-header { padding-bottom: 64vw }
  .item-list li:nth-child(4) .item-header h2 { margin: 0 0 43.6vw; padding: 18vw 0 0 8vw; border-bottom: none }
  .item-list li:nth-child(4) .item-header .num { position: absolute; top: -6vw; left: inherit; right: 4vw; }
  .item-list li:nth-child(4) .item-header-inner { position: absolute; top: 0; right: 0; width: 100%; }
  .item-list li:nth-child(4) .item-body { margin-top: 16vw; }
  .item-list li:nth-child(4) .item-body .cfix { margin-top: 8vw; }
  .item-list li:nth-child(4) .pic01 { text-align: right }
  .item-list li:nth-child(4) .pic01 img { position: relative; width: 72vw; top: inherit; right: -8vw; }
	.item-list li:nth-child(4) .pic02 img { width: 84vw; margin: 4vw 0; }	
  .item-list li:nth-child(4) .cfix .txt-l { margin-top: 0; }
  
  .item-spec { background: #efeeef; padding: 6vw 6vw 4vw; margin: 0 0 0 4.4vw; position: relative; }
  .item-spec h4 { font-size: 14px; margin: 0 0 0.4em; }
  .item-spec p { font-size: 12px; padding: 0; }
  .item-spec .btn { position: relative; top: inherit; right: 0; text-align: right }
  .item-spec .btn a { position: relative; display: inline-block; font-size: 16px; line-height: 2em; font-weight: 500; width: auto; padding-right: 28px; white-space: nowrap; }
  .item-spec .btn a:link,.item-spec .btn a:visited { text-decoration: underline }
  .item-spec .btn a::after { position: absolute; content: ""; right: 2px; top: calc(50% - 4px); width: 14px; height: 8px; background: url("../../img/arw_link.png") no-repeat; background-size: contain; transition: all 0.2s; }
  .item-spec .btn a:hover::after { right: 0; }
  
  .top-collection .block-inner .head { padding: 12vw 8vw 6vw }
  
  .footer { padding: 8vw 0 0 !important; }
  .footer .footer-links { text-align: center; padding: 4vw 8vw; }
  .footer .footer-links { margin: 0; }
  .footer .footer-links li { display: block; text-align: left; margin: 0 0 4vw; }
  .footer .footer-links li span { font-size: 14px; margin: 0 0 0.33em; display: block; }
  .footer .footer-links li a { position: relative; display: inline-block; font-size: 15px; line-height: 2em; font-weight: 500; width: auto; padding-right: 28px; white-space: nowrap; }
  .footer .footer-links li a:link,.footer .footer-links li a:visited { text-decoration: underline }
  .footer .footer-links li a::after { position: absolute; content: ""; right: 2px; top: calc(50% - 4px); width: 14px; height: 8px; background: url("../../img/arw_link.png") no-repeat; background-size: contain; transition: all 0.2s }
  .footer .footer-links li a:hover::after { right: 0; }
  
}