body{
/*	background-color: #faf5d7;*/
	background-color: #fff;
	font-family: sans-serif;
	margin-bottom: 10px;
	margin-top: 102px;
	--center-ad-width: 300px;
	--keyframes_stroke: -83.33%;
	--slider-int-time: 5s;
}

@media print {
   body {
      background-color: #ffffff;
   }
}

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

.btn{
	cursor: default;
	-webkit-user-select: none;
	   -moz-user-select: none;
	    -ms-user-select: none;
	        user-select: none;
}

.no_display{
	display: none;
}

a{
	color: #000;
    text-decoration-line: unset;
}

div{
	word-wrap: break-word;
}

#top_bar{
	Z-index: 2;
    position: fixed;
    top: 0px;
    left: 0px;
    width: 100vw;
	background-color: #fff;
/*    background-color: #faf5d7;*/
}

#title_bar_back{
    width: 100%;
	height: max-content;
	overflow-x: hidden;
}
#title_bar{
	padding-top: 5px;
	padding-bottom: 5px;
    padding-left: 10px;
	width: max-content;
	height: 38px;
}
#title_bar div,
#title_bar img,
#title_bar a{
	float: left;
}
#title_bar #title_txt{
    margin-right: 2px;
    font-size: 25px;
    font-weight: bold;
}
#title_bar #sns_list_btn{
	font-size: 18px;
    font-weight: bold;
    color: #000;
/*    background-color: #aaf;*/
/*    border: solid 2px #ccf;*/
/*    border-radius: 10px;*/
    padding: 5px 5px;
    margin-left: 20px;
}
#title_bar #show_link_btn,
#title_bar #multilink{
	font-size: 18px;
    font-weight: bold;
    color: #d00000;
    padding: 5px 5px;
    margin-left: 2px;
}
#title_bar #search_ico{
	height: 34px;
	margin: 2px;
	display: none;
}
#search_bar{
	background-color: #faf5d7;
	position: absolute;
    bottom: -20px;
    width: 100%;
    opacity: 0;
    transform: translateY(-11px);
	pointer-events: none;
}
#top_bar .search_bar_display{
	opacity: 1;
    transition: 1s;
    transform: translateY(0px);
	pointer-events: auto;
}
#search_bar input{
	width: 99%;
}
#top_sns_list{
	background-color: #faf5d7;
	position: absolute;
    top: 20px;
    width: 100%;
    opacity: 0;
    transform: translateY(-11px);
	pointer-events: none;
	overflow-y: scroll;
}
#top_bar .top_sns_list_display{
	opacity: 1;
    transition: 1s;
    transform: translateY(0px);
	pointer-events: auto;
}
#top_sns_list .center_div{
	display: flex;
    justify-content: center;
}
#top_sns_list .space_div{
	margin: 50px 0px;
}
.separate_bar{
	border-bottom: 2px solid black;
    padding-top: 5px;
    margin-top: 0px;
    margin-bottom: 5px;
}
.separate_bar:nth-child(2){
	padding-top: 0px;
}

#np_icon_base{
	Z-index: 3;
    position: fixed;
    top: 0px;
    left: 0px;
    width: 60px;
    height: 140px;
    background-color: #a7a6a6;
    display: none;
    align-items: center;
    justify-content: center;
    border-radius: 30px 30px 30px 30px;
	-webkit-transform: rotateZ(90deg);
    -ms-transform: rotateZ(90deg);
    transform: rotateZ(90deg);
}
#np_icon_base #np_icon_circle{
    position: relative;
    top: 0px;
    left: 0px;
    width: 50px;
    height: 50px;
    background-color: #e7e7e7;
    border-radius: 25px 25px 25px 25px;
}
#np_icon_base #np_icon_text{
	display: none;
	width: auto;
	height: auto;
	position: absolute;
	left: 0px;
	top: 80px;
	color: #fff;
    font-size: 25px;
    font-weight: bold;
	-webkit-transform: scale(1, 0.8) rotateZ(-90deg);
    -ms-transform: scale(1, 0.8) rotateZ(-90deg);
    transform: scale(1, 0.8) rotateZ(-90deg);
}

#category_bar{
/*	height: 24px;*/
	overflow-x: auto;
	display: flex;
}
#category_bar::-webkit-scrollbar {
  display: none;
}
#category_bar div{
/*	float: left;*/
    margin: 0px 10px;
	white-space: nowrap;
	position: relative;
	font-weight: bold;
}
#category_bar .now_cat{
	color: #f00;
}
#category_bar .now_cat::before{
	content: "[";
    display: block;
    width: 10px;
    height: 100%;
    position: absolute;
    left: -10px;
    top: 0px;
}
#category_bar .now_cat::after{
	content: "]";
    display: block;
    width: 10px;
    height: 100%;
    position: absolute;
    right: -10px;
    top: 0px;
}

#theme_bar{
	display: flex;
    justify-content: space-around;
}
#theme_bar .btn{
	-webkit-transform: rotateZ(90deg);
    -ms-transform: rotateZ(90deg);
    transform: rotateZ(90deg);
    width: min-content;
    height: min-content;
}

#contents_area{
	margin-top: 10px;
	min-height: 100vh;
    display: flex;
    justify-content: space-between;
}
#contents_area>*{
	float: left;
    width: min-content;
    height: max-content;
}
#contents_area .side_ad{
	position: relative;
}
#contents_area #R_ad{
	text-align: right;
}
#contents_area #L_ad::after{
	content: "";
	display: block;
	width: 2px;
	height: 100%;
	background-color: #000;
	position: absolute;
	left: 308px;
	top: 0px;
}
#contents_area #R_ad::after{
	content: "";
	display: block;
	width: 2px;
	height: 100%;
	background-color: #000;
	position: absolute;
	right: 308px;
	top: 0px;
}
#contents_area #main_contents{
	width: -moz-calc(100% - 650px);
	width: -webkit-calc(100% - 650px);
	min-width: min-content;
	padding: 0px 15px;
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    align-items: center;
}
#contents_area #main_contents>*{
	width: var(--center-ad-width);
    max-width: 100%;
    margin-bottom: 20px;
    overflow: hidden;
}

#contents_area #main_contents .product_slider{
	position: relative;
	width: var(--center-ad-width);
    overflow-x: auto;
    display: flex;
    align-items: center;
}
#contents_area #main_contents .product_slider::-webkit-scrollbar{
  display: none;
}
#contents_area #main_contents .product_slider div{
	width: var(--center-ad-width);
	white-space: nowrap;
	position: absolute;
	right: -moz-calc( var(--center-ad-width) * -1 );
	right: -webkit-calc( var(--center-ad-width) * -1 );
	transition-duration: var(--slider-int-time);
    transition-property: transform;
    transition-timing-function: linear;
}
#contents_area #main_contents .product_slider .slider_pos1{
/*	transition-duration: 0s;*/
/*	transform: translateX(0px);*/
	display: none;
}
#contents_area #main_contents .product_slider .slider_pos1 img{
	visibility: hidden;
}
#contents_area #main_contents .product_slider .slider_pos2{
	transform: translateX(-moz-calc( var(--center-ad-width) * -1 ));
	transform: translateX(-webkit-calc( var(--center-ad-width) * -1 ));
}
#contents_area #main_contents .product_slider .slider_pos3{
	transform: translateX(-moz-calc( var(--center-ad-width) * -2 ));
	transform: translateX(-webkit-calc( var(--center-ad-width) * -2 ));
}
#contents_area #main_contents .slider_sel_btn{
	font-weight: bold;
	text-align: center;
	display: flex;
    justify-content: space-evenly;
}
#contents_area #main_contents .slider_sel_btn div{
	padding: 10px;
}

#contents_area #main_contents .showing_txt{
	color: #f00;
	padding-left: 20px;
}

#contents_area #main_contents .center_div{
	display: flex;
    justify-content: center;
}
#contents_area #main_contents .space_div{
	margin: 50px 0px;
}
#contents_area #main_contents .separate_str{
	font-size: 3em;
    font-weight: bold;
}
#contents_area #main_contents .bottom_space_div{
	margin: 0px 0px 50px 0px;
}
#contents_area #main_contents .up_space_div{
	margin: 30px 0px 0px 0px;
}
#contents_area #main_contents .sub_cat_str{
/*	font-size: 1.7em;*/
    font-weight: bold;
}
#contents_area #main_contents .news_title{
	font-size: 1.3em;
    font-weight: bold;
}
#contents_area #main_contents .link_list_str{
	font-size: 1.2em;
    font-weight: bold;
}
#contents_area #main_contents .news_link_txt{
	margin: 10px 0px;
}
#contents_area #main_contents img{
	max-width: var(--center-ad-width);
	display: block;
}
@keyframes sliderAnimation {
  100% {
    transform: translateX( var(--keyframes_stroke) );
  }
}
#contents_area #main_contents .catch_copy{
	font-size: 0.8em;
    font-weight: bold;
}
#contents_area #main_contents .creator_name{
	font-weight: bold;
    border-bottom: 1px solid #000;
}
#contents_area #main_contents .pr_txt{
	font-size: 0.9em;
	word-wrap:break-word;
}
@media only screen and (max-width: 978px) {
	#contents_area #R_ad{
		display: none;
	}
	#contents_area #L_ad{
		display: none;
	}
	#contents_area #main_contents{
		width: 100%;
		padding: 0px;
	}
}
