@charset "utf-8";

/* コンテンツエリア
-----------------------------------------------------------------------------------------*/
#c_sub .side_menu_none {
	display:none;
}
#contents_area #c_main {
	width:956px;
}
#c_main .index_box01 ul.list {
	margin: 0 auto;
	padding: 0 0 0 25px;
	width: 100%;
	list-style: none;
	box-sizing: border-box;
}
#c_main .index_box01 ul.list:after {
	content : "";
	display : block;
	height : 0;
	clear : both;
}
#c_main .index_box01 ul.list li {
	margin: 0 13px 55px 0;
	padding: 0;
	width: 278px;
	font-size: 0.875em;
	color: #ffffff;
	line-height: 130%;
	text-align : left;
	float: left;
	position:relative;
}
#c_main .index_box01 ul.list li img {
	width:278px;
	height:208px;
}

#c_main .index_box01 ul.list li strong {
	display: block;
	margin: 12px 0 8px 0;
	padding: 0;
}
/*#c_main .index_box01 ul.list li strong a {
	text-decoration:none;
}*/
#c_main .index_box01 ul.list li strong.new {
	background: url(../../COMMON/IMAGES/new.gif) top left no-repeat;
	background-position: 0 4px;
	text-indent: 36px
}
#c_main .index_box01 ul.list li span.cate {
	font-size:10px;
	display:inline-block;
	margin:0 3px 4px 0;
	padding:0 5px;
	border:1px solid #aaa;
	text-indent:0;
	color:#aaa;
}

#c_main .index_box01 ul.list li span.rental_name {
	position:absolute;
	top:-20px;
	right:0;
	width:100%;
	box-sizing:border-box;
	display:block;
	background:#aeda69;
	padding:1px 3px;
	color:#000;
	font-weight:bold;
	font-size:9px;
	text-align:left;
}
#c_main .index_box01 ul.list li span.rental_tel {
	position: absolute;
    top: 192px;
    right: 0;
    width: 100%;
    box-sizing: border-box;
    display: block;
    background: #aeda69;
    padding: 1px 8px;
    color: #000;
    font-weight: bold;
    font-size: 8px;
    text-align: center;
}
#c_main .index_box01 ul.list li span.rental_tel strong {
	display:inline-block;
	margin: 1px 0 1px 3px;
}


#c_main .index_box01 ul.list li span.css_name {
	position:absolute;
	top:-20px;
	right:0;
	width:100%;
	box-sizing:border-box;
	display:block;
	background:#ffe700;
	padding:1px 3px;
	color:#000;
	font-weight:bold;
	font-size:9px;
	text-align:left;
}
#c_main .index_box01 ul.list li span.css_tel {
	position: absolute;
    top: 192px;
    right: 0;
    width: 100%;
    box-sizing: border-box;
    display: block;
    background: #ffe700;
    padding: 1px 8px;
    color: #000;
    font-weight: bold;
    font-size: 8px;
    text-align: center;
}
#c_main .index_box01 ul.list li span.css_tel strong {
	display:inline-block;
	margin: 1px 0 1px 0;
}
#c_main .index_box01 ul.list li.center {
	background:none;
	padding: 0;
}

#c_main .view_box01 p {
	margin: 0 auto 20px auto;
	padding: 0;
	width:820px;
	font-size: 0.9em;
	color: #ffffff;
	line-height: 200%;
	text-align : left;
}
#c_main .view_box01 .image p a {
	position:relative;
	display:block;
}
#c_main .view_box01 .image p a .rental_name {
	position:absolute;
	top:-22px;
	right:0;
	width:100%;
	box-sizing:border-box;
	display:block;
	background:#aeda69;
	line-height:100%;
	padding:5px 8px;
	color:#000;
	font-weight:bold;
	font-size:12px;
	text-align:left;
}
#c_main .view_box01 .image p a .rental_tel {
	position:absolute;
    top: 300px;
	right:0;
	width:100%;
	box-sizing:border-box;
	display:block;
	background:#aeda69;
	line-height:100%;
	padding:7px 8px;
	color:#000;
	font-weight:bold;
	font-size:11px;
	text-align:center;
}
#c_main .view_box01 .image p a .css_name {
	position:absolute;
	top:-22px;
	right:0;
	width:100%;
	box-sizing:border-box;
	display:block;
	background:#ffe700;
	line-height:100%;
	padding:5px 8px;
	color:#000;
	font-weight:bold;
	font-size:12px;
	text-align:left;
}
#c_main .view_box01 .image p a .css_tel {
	position:absolute;
    top: 300px;
	right:0;
	width:100%;
	box-sizing:border-box;
	display:block;
	background:#ffe700;
	line-height:100%;
	padding:7px 8px;
	color:#000;
	font-weight:bold;
	font-size:11px;
	text-align:center;
}
#c_main .view_box01 .image {
	margin: 40px auto 40px auto;
	padding: 0;
	width: 820px;
}
#c_main .view_box01 .image:after {
	content : "";
	display : block;
	height : 0;
	clear : both;
}
#c_main .view_box01 .image p.left {
	margin: 0;
	padding: 0;
	width: 400px;
	float: left;
}
#c_main .view_box01 .image p.right {
	margin: 0;
	padding: 0;
	width: 400px;
	float: right;
}
#c_main .view_box01 p.price {
	border-top: 1px dotted #bbb;
	border-bottom: 1px dotted #bbb;
	margin: 30px auto;
	padding: 12px 0;
	width: 820px;
	text-align : right;
}
#c_main .view_box01 p.price strong {
	font-size: 1.1em;
}
#c_main .view_box01 p.price strong span {
	font-size: 1.5em;
}
#c_main .view_box01 p.link {
	text-align : right;
	border-bottom: 1px dotted #333333;
	margin: 0 auto 10px;
	padding: 0 0 12px;
	width: 820px;
}
#c_main .view_box01 p.link a[href^="http://"] {
	display: inline-block;
	padding-left: 20px;
	background: url(../IMAGES/icon_external.png) no-repeat left center;
}
#c_main .view_box01 p.link a[href^="https://"] {
	display: inline-block;
	padding-left: 20px;
	background: url(../IMAGES/icon_external.png) no-repeat left center;
}
#c_main .view_box01 p.link a[href^="https://www.youtube.com/"],
#c_main .view_box01 p.link a[href^="https://youtu.be/"]  {
	display: inline-block;
	padding: 3px 0 3px 70px;
	background: url(../IMAGES/icon_youtube.png) no-repeat left center;
}
#c_main .view_box01 p.link a[href^="https://vimeo.com/"] {
	display: inline-block;
	padding: 3px 0 3px 90px;
	background: url(../IMAGES/icon_youtube_vimeo.png) no-repeat left center;
}
#c_main .view_box01 p.link a[href^="https://www.circle-j.co.jp/colorbox/"] {
	display: inline-block;
	padding: 3px 0 3px 90px;
	background: url(../IMAGES/icon_youtube_vimeo.png) no-repeat left center;
}
#c_main .view_box01 p.link a[href^="https://www.circle-j.co.jp/PDF/"] {
	display: inline-block;
	padding-left: 30px;
	background: url(../IMAGES/icon_pdf.png) no-repeat left center;
}
#c_main .view_box01 p.button {
	border-top: 1px dotted #333333;
	margin: 0 auto;
	padding: 24px 0 0 0;
	width: 100%;
	text-align : center;
}
#c_main .view_box01 p.button2 {
	border-top: 1px dotted #333333;
	margin: 0 auto;
	padding: 24px 0;
	width: 100%;
	text-align : center;
}
#c_main .view_box01 p.button2 img {
	display: inline;
	width:200px;
	height:38px;
}

#contents_area #c_main h2.index_title {
	margin:0 0 5px 0;
	padding:0 0 0 10px;
	font-size:1em;
	color:#fff;
	border-left:4px solid #ffe800;
}
#contents_area #c_main h2.index_title span {
	display:none;
}
#c_main .view_box01 .view_tel {
	margin-bottom:40px;
}
#c_main .view_box01 .view_tel p{
	text-align:center;
	font-size: 16px;
	margin:0 auto 0;
}
#c_main .view_box01 .view_tel a{
	text-align:center;
	font-size: 40px;
	font-weight: bold;
	text-decoration:none;
	margin:0 auto;
	color:#fff000;
}
#c_main .view_box01 .view_tel a:hover{
	color:#fff000;
}
#c_main .view_box01 .view_tel a i {
	margin-right:10px;
}


/* サイトマップ
-----------------------------------------------------------------------------------------*/
#contents_area #c_main #circle_Index {
	margin: 0 0 0 10px;
}
#contents_area #c_main #circle_Index h4 {
	margin: 0;
	padding: 10px 0 5px 0;
	width: 696px;
	background: none;
	border-bottom: 1px dotted #999;
	color: #FFF;
	font-size: 16px;
	font-weight: bold;
	clear: both;
}
#circle_Index span {
	color: #F30;
}
#circle_Index .js-masonry {
	padding: 0;
}
#circle_Index .js-masonry .item {
	margin: 0 0 10px 10px;
	padding: 8px 10px 8px 10px;
	width: 202px;
	background-color: #222;
	border-radius: 5px;
	font-size: 15px;
	list-style: none;
	color: #FFF;
	text-decoration: none;
	font-weight: bold;
}
#circle_Index .js-masonry .item ul {
	margin: 10px auto 0;
	padding: 8px 20px 0 10px;
	overflow: hidden;
	border-top: 1px dotted #777;
}
#circle_Index .js-masonry .item ul li {
	margin: 0 0 0 10px;
	padding: 0;
	font-size: 12px;
	list-style: disc;
	color: #fff;
}
#circle_Index .js-masonry .item ul li a {
	text-decoration: none;
	font-weight: normal;
}

/* レンタルインデックス 上書き
-----------------------------------------------------------------------------------------*/
#h2_title {
	margin: -5px 5px 10px;
	font-size: 18px;
	font-weight: normal;
	color: #fff;
}

#contents_area #c_sub #bn_special li#biz_hour {
	display:none;
}

/* CSS カテゴリTOP
-----------------------------------------------------------------------------------------*/

#css_list #contents_area #c_main h2.no_pc {
	display:none;
}
.join_box {
	margin:20px 0 50px;
	padding:0 30px;
	color:#fff;
	border-radius: 5px;
 	border: 1px solid #4c4c4c;
 	box-sizing: border-box;
	font-size:0.875em;
}
.join_box ul {
	padding:0;
	display:flex;
	list-style:none;
}
.join_box ul li {
	padding: 0 10px;
}
.join_box ul li.fl_left {
	width:63%;
}
.join_box ul li.fl_right {
	width:37%;
	margin-top:10px;
	text-align:center;
}
.join_box ul li.fl_right a img {
	margin:0 auto;
}
.join_box ul li a {
	color:#FF3;
}
.join_box ul li.fl_right a {
	display:block;
}
.join_box ul li span.link_excel a {
  display: inline-block;
  background: url(../../join/IMAGES/icon_excel.png) no-repeat center left;
  padding: 10px 0 10px 30px;
}
.join_box ul li.fl_right p {
	margin:0;
}


.css_VR_bn {
	margin:0 auto 30px;
	width:860px;
}
.css_VR_bn img {
	width:100%;
	height:auto;
}
.css_category {
	margin:0 auto;
	padding:0;
	overflow:hidden;
	display:flex;
	flex-flow: row wrap;
	justify-content: center;
	width:90%;
}
.css_category li {
	margin:0 8px 40px;
	width:45%;
	color:#FF3;
	list-style:none;
	line-height:1.1;
}
.css_category li a {
	text-decoration:none;
	border:1px solid #575757;
	padding:0;
	display:block;
	color:#FF3;
	overflow: hidden;
}
.css_category li a:hover {
	border:1px solid #FF3;
	color:#FF3;
}
.css_category li a img {
	opacity: 1;
	width: 100%;
	height:auto;
	-moz-transition: -moz-transform 0.3s linear;
	-webkit-transition: -webkit-transform 0.3s linear;
	-o-transition: -o-transform 0.2s linear;
	-ms-transition: -ms-transform 0.3s linear;
	transition: transform 0.3s linear;
}
.css_category li a:hover img {
	opacity:1;
	-webkit-transform: scale(1.046);
    -moz-transform: scale(1.046);
    -o-transform: scale(1.046);
    -ms-transform: scale(1.046);
    transform: scale(1.046);
}
.css_VR_bn .line_yellow,
.css_category li .line_yellow {
	display:block;
	width:55px;
	height:5px;
	background-color:#FF3;
	margin-bottom:10px;
}
#contents_area #c_main h3.txt {
	background-image:none;
	background: linear-gradient(180deg, rgb(0, 0, 0) 0%, rgb(60, 60, 60) 100%);
	padding: 10px 0 5px 15px;
	font-size: 1.2em;
	
}
#contents_area #c_main .css_category li h3 {
	display:block;
	background: url(../IMAGES/bg_csslist_h3.gif);
	margin:0;
	padding:13px 18px;
	font-family:Dosis;
	font-weight:700;
	font-size: 25px;
	color: #FF3;
	border-bottom:none;
}
#contents_area #c_main .css_category li h3 span {
	display:block;
	margin-top:3px;
	font-size:13px;
	font-weight:normal;
}

