

body{-webkit-text-size-adjust:100%;}
#articleDetail{margin-bottom:40px;}
#articleDetail th,#articleDetail td,#articleDetail h1,#articleDetail h2,#articleDetail h3,#articleDetail h4,#articleDetail h5,#articleDetail h6{line-height:1.6; margin:0; padding:0;}
#articleDetail dl{margin-bottom:0; margin-top:0;}
#articleDetail main{overflow:visible;}
#articleDetail p{margin-bottom:0; margin-top:15px;}

#articleDetail .inner{padding:0;}
#articleDetail table{border-collapse:collapse; border-spacing:0; table-layout:fixed;}
#articleDetail img{vertical-align:top; border-width:0; border-style:none; max-width:100%; height:auto;}
#articleDetail a{text-decoration:none; display:inline-block;}
#articleDetail a:hover{text-decoration:none;}
#articleDetail h1,#articleDetail h2,#articleDetail h3,#articleDetail h4,#articleDetail h5,#articleDetail h6{color:#000;}
#articleDetail h3,#articleDetail h4,#articleDetail h5,#articleDetail h6{font-size:18px; font-weight:bold;}
@media screen and (max-width:768px){
#articleDetail h3,#articleDetail h4,#articleDetail h5,#articleDetail h6{font-size:16px; font-weight:bold;}
}
#articleDetail li:has(.ss-content-area:empty){display: none;}

/*============== common ==============*/
#articleDetail{
	width:100%;
	font-size: 16px;
	line-height:1.8;
	color:#000;
	position:relative;
    margin-top:50px;
}
#articleDetail p + p{
	margin-top:15px;
}
#articleDetail .articleTemplate,
#articleDetail section{
	width:800px;
    max-width:100%;
	margin:0 auto;
	padding: 0;
}

#articleDetail .textStrong{
	font-weight:bold;
}
#articleDetail .yellowBorder{
	background: linear-gradient(transparent 60%, #ffff8e 40%);
	font-weight:bold;
}
#articleDetail .textLink{
	position:relative;
}
#articleDetail .textLink::after{
	display:inline-block;
	content:'\f054';
	font-family:FontAwesome;
	padding-left:5px;
	text-decoration:none;
	text-rendering:auto;
	-webkit-font-smoothing:antialiased;
}
#articleDetail .textLink[target="_blank"]{
	position:relative;
}
#articleDetail .textLink[target="_blank"]::after{
	display:inline-block;
	content:'\f2d2';
	font-family:FontAwesome;
	padding-left:5px;
	text-decoration:none;
	text-rendering:auto;
	-webkit-font-smoothing:antialiased;
}
@media screen and (max-width:768px){
	#articleDetail .articleTemplate,
    #articleDetail section{
		width:96%;
		margin:0 2%;
		padding: 0;
	}
}

#articleDetail small{font-size:80%;}
#articleDetail .css-font-size-large{font-size:120%;}

/*------管理画面文字サイズ 最小/小/大/最大 設定-----*/
#articleDetail .ss-font-size-x-small{font-size:60%;}
#articleDetail .ss-font-size-small{font-size:80%;}
#articleDetail .ss-font-size-large{font-size:120%;}
#articleDetail .ss-font-size-x-large{font-size:130%;}

/*============== #headSection ==============*/

#articleDetail #headSection{
    border-top:solid 1px #000;
}

#articleDetail #headSection h1{
	font-size:30px;
	padding:15px 0;
	border-top:2px solid #000;
	font-weight:bold;
    margin-top:3px;
}
#articleDetail #headSection .moreInfo{
    display: flex;
  justify-content:space-between;
    align-items:flex-start;
    margin-top:0;
}
#articleDetail #headSection .publish-date{
	color:#999;
    font-size: 85%;
    margin-top:0;
}
#articleDetail #headSection .user-info{
    display: flex;
  justify-content:center;
    align-items:center;
    margin-top:0;
}
#articleDetail #headSection .user-info img{
    width:35px;
    height:35px;
    margin-left:5px;
}
#articleDetail #headSection .user-info .name{font-size:15px; margin-left:5px;}

@media screen and (max-width:768px){
	#articleDetail #headSection h1{
		font-size:24px;
		padding:20px 0 10px;
	}
	#articleDetail #headSection .user-info .name{
		font-size:13px;
	}
}

/*============== section contents ==============*/

/*------目次用-----*/
#articleDetail .ss-mokuji {
    margin-bottom: 30px;
    padding: 10px 20px;
    background:#f6f6f6;
}

#articleDetail .ss-mokuji p {
    color: #666;
    letter-spacing:0.3em;
    font-size: 110%;
    display: flex;
    align-items: center;
    margin-top:0;
}
#articleDetail .ss-mokuji p:before, #articleDetail .ss-mokuji p:after {
    content: "";
    flex-grow: 1;
    border-top: 2px dotted #999;
    display: block;
}
#articleDetail .ss-mokuji p:before {
    margin-right: .4em;
}
#articleDetail .ss-mokuji p:after {
    margin-left: .4em;
}

#articleDetail .ss-mokuji ol.o-midashi{
    font-weight:bold;
}

#articleDetail .ss-mokuji ol.komidashi {
    list-style-type: disc;
    margin: 0;
    padding: 0 1.2em 0 2.4em;
    overflow: hidden;
    font-size:90%;
    font-weight:normal;
}

#articleDetail .ss-mokuji ol ol {
    margin-top: 5px;
}

#articleDetail .ss-mokuji li {
    padding: 2px 0;
    margin-top:5px;
    color:#666!important;
}

#articleDetail .ss-mokuji a{
    color:#666;
    text-decoration:underline;
    display:inline;
}
#articleDetail .ss-mokuji a:hover {
    text-decoration:none;
}


/*------記事-----*/
#articleDetail #articleBody{
    margin-bottom:50px;
}

#articleDetail .boxtype-1-list, #articleDetail .boxtype-2-list{
    margin-top:50px;
}
#articleDetail .boxtype-2-list li:nth-child(2){
    margin-top:30px;
}

#articleDetail h2{
	font-size:24px;
	padding:15px;
	border-top:2px solid #000;
	border-bottom:2px solid #000;
	margin:0 0 20px;
}

#articleDetail .boxtype-3-list, #articleDetail .boxtype-4-list{
  display: flex;
  flex-wrap: wrap;
  column-gap:20px;
  align-items: center;    
}

#articleDetail .boxtype-3-list li{
        width:calc(50% - 10px);
        margin-top:30px;
}
#articleDetail .boxtype-4-list li[class^="position-"]{
        width:calc(50% - 10px);
        margin-top:30px;
}

@media screen and (max-width:768px){
	#articleDetail h2{
		font-size:20px;
		padding:10px;
	}
    #articleDetail .boxtype-3-list li, #articleDetail .boxtype-4-list li[class^="position-"]{
        width:100%;
        margin-top:30px;
    }
    #articleDetail ul:has(> li:first-of-type > .content-area-description) {
        flex-direction: column-reverse;
    }
}

#articleDetail .content-area-product{
    display:flex;
    align-items:flex-start;
}
#articleDetail .content-area-product .ss-content-product-img img{width:100px; max-width:none; margin-right:10px;}
#articleDetail .content-area-product .ss-content-product-img a:hover{opacity:0.7;}
#articleDetail .content-area-product .ss-product-label{color:#999; font-size:75%; margin:0;}
#articleDetail .content-area-product .ss-product-name{font-size:85%; margin-top:5px;}
#articleDetail .content-area-product .ss-product-price{display:none;}/*変更不可*/

#articleDetail .tags, #articleDetail .all-industry-article{display:none;}


#articleDetail .toPDPbtn{
	margin:10px 0 5px;
	padding:0px 10px;
	color:#fff;
	background:#000;
	font-weight:bold;
	display:inline-block;
	position:relative;
    font-size:90%;
}
#articleDetail .toPDPbtn::after{
	margin:5px 0;
	display:inline-block;
	content:'\f054';
	font-family:FontAwesome;
	padding-left:10px;
	text-decoration:none;
	text-rendering:auto;
	-webkit-font-smoothing:antialiased;
}

/*------youtube用-----*/
#articleDetail iframe{
    width:100%;
    height: 100%;
    aspect-ratio: 16 / 9;
}

/*------キュレーション用-----*/
#articleDetail #ss-userSnapBlock{margin-top:-50px;}

/*------イチオシ記事紹介用-----*/
#articleDetail .boxtype-4-list li:has(.content-area-coordinate){
    width: calc(24% - 10px);
}
#articleDetail ul.ss-content-user-info-list{
    display:flex;
    margin-top:10px;
}
#articleDetail .ss-content-user-image{
    width:44px!important;
}
#articleDetail ul.ss-content-user-info-list li:nth-child(2){
    width: calc(100% - 40px);
}
#articleDetail .ss-content-user-image img{
    width: 34px;
    height: 34px;
    border-radius: 34px;
}
#articleDetail .ss-content-user-meta-list li:has(.ss-content-user-label),
#articleDetail .ss-content-user-meta-list li:has(.ss-content-user-height){
    display:none;
}
#articleDetail .ss-content-user-meta-list .ss-content-user-shop,
#articleDetail .ss-content-user-meta-list .ss-content-user-name{
    margin:0;
    width: 140%;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
#articleDetail .ss-content-user-meta-list .ss-content-user-shop{
    font-size:10px;
    color:#999;
}
#articleDetail .ss-content-user-meta-list a:has(.ss-content-user-name){
    color:#000;
    text-decoration:none;
    font-size:12px;
}

@media screen and (max-width:768px){
    #articleDetail .boxtype-4-list li:has(.content-area-coordinate){
    width: calc(48% - 10px);
    margin-top;0px;
}
}


/*============== 一覧へボタン ==============*/
#articleDetail .ss-content-link-non-ogp-box a{
	font-size:18px;
	width:80%;
	margin:0 auto;
	padding:15px 5px;
	display:block;
	background:#000;
	color:#fff;
	font-weight:bold;
	text-align:center;
	text-decoration:none;
    line-height: 1.2;
}
#articleDetail .ss-content-link-non-ogp-box a:hover{opacity:0.7;}
#articleDetail .ss-content-link-non-ogp-box a::after{
	margin:5px 0;
	display:inline-block;
	content:'\f054';
	font-family:FontAwesome;
	padding-left:10px;
	text-decoration:none;
	text-rendering:auto;
	-webkit-font-smoothing:antialiased;
}
#articleDetail .ss-content-link-non-ogp-box a[target="_blank"]::after{
	content:'\f2d2';
}

@media screen and (max-width:768px){

	#articleDetail .ss-content-link-non-ogp-box a{
		font-size:16px;
		width:100%;
		margin:0 auto;
		padding:15px 5px;
	}
}



/*============== 一覧へボタン ==============*/
/*.ss-content-link-non-ogp-boxGotop{
	display:none;
}*/
/*.ss-content-link-non-ogp-boxGotop a{
	font-size:14px;
	width:50px;
	height:50px;
	color:#fff;
	font-weight:bold;
	text-align:center;
	background:#999999;
	border:1px solid #fff;
	border-radius:5px;
	position:fixed;
	right:50px;
	bottom:15px;
	z-index:2;
	transition:none;
	font-family:"Yu Gothic",YuGothic,"Hiragino Kaku Gothic ProN",Meiryo,"Open Sans",Helvetica,Arial,-apple-system,blinkMacSystemFont,sans-serif;
}
.ss-content-link-non-ogp-boxGotop a:hover,
.ss-content-link-non-ogp-boxGotop a:focus{
	text-decoration:none;
}
@media screen and (max-width:1024px){
	.ss-content-link-non-ogp-boxGotop a{
		font-size:12px;
		width:40px;
		height:40px;
		right:15px;
		bottom:15px;
	}
}*/

