@charset "utf-8";

/* collabo-office
--------------------------------------------------------------- */

.collabo-nx-2 .box-l2{
    float:left;
	width:36%;
}

.collabo-nx-2 .box-r2{
	float:right;
	width:60%;
}

.collabo-nx-2 .box-r2 p:first-of-type{
	font-size:1.8em;
	line-height:120%;
	margin:0 0 10px;
}

.collabo-nx-2 .box-r2 p:last-of-type{
	margin:0 0 10px !important;
}


.collabo-nx-2 .box-l{
    float:left;
	width:42%;
}

.collabo-nx-2 .box-r{
	float:right;
	width:54%;
}

.collabo-nx-2 .box-l p{
	font-size:.7em;
	line-height:120%;
}

.collabo-nx-2 .box-r p{
	margin:20px 0 0;
}

.collabo-nx-3 .box-l{
    float:left;
	width:40%;
}

.collabo-nx-3 .box-r{
	float:right;
	width:55%;
}

ul.l-normal {
	margin-left: 1.5em;
	display:block;
}

ul.l-normal li {
	list-style-type:none;
	text-indent: -1em;
	margin:0;
	padding:0;
}

ul.l-circle,
ul.l-square{
  margin-left: 1.5em;
}

ul.l-circle li,
ul.l-square li{
  position: relative;
  margin-bottom:.5em;
  list-style:none;
}

ul.l-circle li:before{
	content: "";
	position: absolute;
	top: 8px;
	left: -15px;
	bottom: auto;
	right: auto;
	margin: auto;
	width: 6px;
	height: 6px;
	border: 1px solid #A6A6A6;
	border-radius: 100%
}

ul.l-square li:before{
  content: "";
  display: block;
  position: absolute;
  top: 5px;
  left: -20px;
  bottom: auto;
  right: auto;
  margin: auto;
  width: 10px;
  height: 10px;
  background: #333;
}

ul.l-square li.l-square-none:before{
	display:none;
}

ul.l-square li p{
	padding-left:37px;
}

ul.l-square li p span{
	font-size:.8em;
}


.collabo-nx-4 .box-l{
    float:left;
	width:60%;
	margin-right: 5%;
}


.collabo-nx-4 .box-c{
	float:left;
	width:25%;
}

.collabo-nx-4 .box-r{
	float:left;
	width:35%;
}

.collabo-nx-4 .notice{
	clear: both;
    padding-top: 10px;
    font-size: 0.9em;
}

.collabo-nx-4 em {
	position: relative;
	font-size:1.4em;
	line-height:150%;
	font-weight:normal;
	margin-bottom:10px;
	padding:0 1em 0 1.5em;
	display:block;
}

.collabo-nx-4 em::after {
	position: absolute;
	top: .2em;
	left: 0;
	z-index: 2;
	content: '';
	width: 20px;
	height: 20px;
	border: 5px solid #A6A6A6;
	border-radius: 100%
}

.collabo-nx-5 .btn a {
    padding: 15px 50px;
    font-size: 1em;
}

.collabo-nx-5 em{
	font-size:1.4em;
	display:block;
	margin-bottom:20px;
}

a.exit:after {
content: url(../img/icon_blank.png);
position: relative;
margin-left: 0.5em;
}

@media only screen and (max-width: 640px) {

.collabo-nx-2 .box-l,
.collabo-nx-2 .box-r,
.collabo-nx-3 .box-l,
.collabo-nx-3 .box-r,
.collabo-nx-4 .box-l,
.collabo-nx-4 .box-c,
.collabo-nx-4 .box-r{
    float:none;
	width:100%;
}

.collabo-nx-2 .box-r{
	margin-top:20px;
}

}









.collabo-nx-2 .topicCapton{
	margin:0 0 30px;
}
.collabo-nx-2 .topicCapton .title{
	font-size: 2.4em;
	font-weight: bold;
	text-align: center;
	line-height: 1.4;
}
.collabo-nx-2 .topicCapton .title br{
	display: none;
}

.collabo-nx-2 .topicCapton .title small{
    font-size: 0.8em;
    display: block;

}
.collabo-nx-2 .topicCapton .box{
	margin:20px auto 0;
	padding:10px 15px;
	border: 2px solid #333;
	font-size: 1.3em;
	font-weight: bold;
	width: fit-content;
}


.collabo-nx-2 .box-l{
    width:100%;
	margin-bottom:25px;
}
.collabo-nx-2 .box-l img{
    width:100%;
	height:auto;
}
.collabo-nx-2 .box-l small{
	margin:5px 0 0;
    display: block;
	font-size: 0.85em;
	text-align: right;
}

.collabo-nx-2 .box-r{
	width:100%;
	margin-bottom:25px;
}
.collabo-nx-2 .box-r p:first-of-type{
	font-size:1.4em;
	line-height:120%;
	margin:30px 0 10px;
	font-weight:bold;
}




dl.tblIna01{
	display:table;
	width:100%;
}
dl.tblIna01 dt{
	width:30%;
	padding:20px 10px;
	background:#476A80;
	color:#FFF;
	text-align:center;
	vertical-align:middle;
    display:table-cell;
}
dl.tblIna01 dd{
	width:70%;
	padding:20px;
	background:#F0F0F0;
	text-align:left;
	vertical-align:middle;
    display:table-cell;
}
dl.tblIna01 dd .btnFormat01{
	margin:auto;
	padding: 8px 0;
    width: 80%;
}
dl.tblIna01 + dl.tblIna01{
	border-top:1px solid #000;
}


#tokucyo{
	margin:60px 0  0;
	padding:0;
	border-top:1px solid #95989A;
}

#tokucyo .clmItem div:nth-of-type(1){
	float:right;
	width:44%;
}
#tokucyo .clmItem div:nth-of-type(1) img{
	width:100%;
	height:auto;
}

#tokucyo .clmItem{
	padding:30px 0;
	overflow:hidden;
	border-bottom:1px dotted #95989A;
}
#tokucyo .clmItem:last-of-type{
	margin-top:30px;
	padding:5%;
	background:#F7F7F7;
	border-bottom:none;
}
#tokucyo .clmItem:nth-last-of-type(2){
	border-bottom:1px solid #95989A;
}

#tokucyo .clmItem div:nth-of-type(2){
	float:left;
	width:54%;
	font-size:1.3em;
}
#tokucyo .clmItem div:nth-of-type(2) strong{
	display:block;
	font-size:1em;
	margin-bottom:10px;
    color: #476A80;
}
#tokucyo .clmItem div:nth-of-type(2) p{
	line-height:1.4;
	font-size:0.8em;
}
#tokucyo .clmItem div:nth-of-type(2) strong:nth-of-type(n+2){
	margin-top:30px;
}
#tokucyo .clmItem div p a{
	display:inline-block;
	margin-top:20px;
	padding:8px 20px;
	text-decoration:none;
	background:#576579;
	color:#FFF;
	font-size:1em;
	border-radius:3px;
}
#tokucyo .clmItem div p a:hover{
	opacity:0.8;
}
#tokucyo .clmItem small{
	font-size:0.9em;
	color:#555;
}


.clmMes01{
	margin:0 auto 30px;
	font-size:1.4em;
	text-align:center;
	width:88%;
	line-height:1.4;
}


.clmPoint{
	border:3px solid #576579;
	overflow:hidden;
	margin: 60px 0 20px;
}
.clmPoint dt{
	padding:10px;
	background:#576579;
	color:#FFF;
	text-align:center;
    font-size: 1.3em;
    font-weight: bolder;
}
.clmPoint dt strong{
	font-size:1.6em;
}
.clmPoint dd{
}
.clmPoint dd ul{
	padding:20px;
	overflow:hidden;
}
.clmPoint dd ul li{
	position:relative;
	width:48%;
	padding:10px 0 10px 40px;
    color: #576579;
    font-weight: bolder;
}
.clmPoint dd ul li a{
	color: inherit;
}
.clmPoint.notNumber dd ul li{
	width:46%;
	margin-left:2%;
	padding:8px 0 8px 0px;
	list-style-type: disc;
}
.clmPoint dd ul li:nth-of-type(2n+1){
	float:left;
	clear: both;
}
.clmPoint dd ul li:nth-of-type(2n){
	float:right;
}
.clmPoint dd ul li span{
	position:absolute;
	left:0;
	top:5px;
	border:4px solid #576579;
	padding:0 5px;
	display:inline-block;
	margin-right:10px;
    font-weight: bolder;
}

.note01{
	margin-top:40px;
	font-weight: bold;
	color: #576579;
}
.note01 p{
	
}
.note01 ul{
	margin-top:20px;
	margin-left: 30px;
}
.note01 ul li{
	margin-top: 10px;
	list-style:disc;
}

.cap01{
	margin:60px 0 20px;
	padding:15px;
	background:#EDEDED;
	color:#000;
	text-align:center;
    font-size: 1.2em;
    font-weight: bolder;
}
.cap02{
	margin:60px 0 20px;
	padding:15px;
	background:#EDEDED;
	color:#576579;
	text-align:left;
    font-size: 1.2em;
    font-weight: bolder;
	border-left:9px solid #576579;
}
.cap02 + ul{
	color:#666;
}
.cap02 + ul > li{
	list-style-type: disc;
	margin-left: 40px;
	padding: 3px 0;
}


ul.clmPhoto{
	margin:0;
	overflow:hidden;
}
ul.clmPhoto li{
    width:22%;
	margin:0 4% 0 0;
	text-align:center;
	float:left;
	font-size:0.9em;
}



ul.clmPhoto li:nth-of-type(4n){
	margin-right:0;
}
ul.clmPhoto li:nth-of-type(4n+1){
    clear: both;
}
ul.clmPhoto li:nth-of-type(n+5){
	margin-top:20px;
}
ul.clmPhoto li img{
	display:block;
	width:100%;
	height:auto;
	margin:auto auto 5%;
}

ul.clmPhoto li a{
    position: relative; 
    display: block;
}

ul.clmPhoto li a i{
    position: absolute;
    background-image: url(../img/zoom.png);
    bottom: 4px;
    right: 4px;
    z-index: 20;
    height: 15px;
    width: 15px;
    background-size: contain;
}


.tblAtt{
	margin:10px 0 0;
	text-align:right;
	font-size:0.8em;
	color:#707070;
}


.tbl01{
	border-top:1px solid #707070;
}
.tbl01 tr{
	border-bottom:1px solid #707070;
}
.tbl01 th, .tbl01 td{
	padding:15px 30px;
}
.tbl01 th{
    background: #707070;
    color: #FFF;
	text-align:center;
    border-top: 1px solid #FFF;
	white-space:nowrap;
}

.tbl01 tr:first-of-type th{
	border-top:1px solid #707070;    
}

.tbl01 td{
	
}
.tbl01 small{
	font-size:0.8em;
	line-height: 1.4;
    display: block;
}


.clmDLlist{
	overflow:hidden;
}
.clmDLlist a{
	float:left;
	width:50%;
	padding:0 3%;
}

.clmBase{
	margin:0 auto 0;
}

.btnFormat01{
	display:block;
	background:#C6A20E;
	color:#FFF;
	border-radius:200px;
	text-align:center;
	padding:15px 0;
	width:60%;
	letter-spacing:1px;
	text-decoration:none;
}
.btnFormat01:hover{
	color:#FFF;
	opacity:0.8;
}
.btnFormat01.c02{
	background:#E60114;
}



.clmBackBtn{
	margin-top:30px;
	text-align:center;
}

a.tel{
    text-decoration: none;
}









@media only screen and (max-width: 640px) {
	
	.tblAtt{
		text-align:left;
	}
	
	dl.tblIna01{
		display:block;
	}
	dl.tblIna01 dt, dl.tblIna01 dd{
		width:100%;
		display:block;
	}
	dl.tblIna01 + dl.tblIna01{
		margin-top:10px;
	}
	

	.btnFormat01{
		width:100% !important;
	}
	
	.tbl01 th, .tbl01 td {
		display:block;
		padding:10px 10px;
        text-align: left;
    }
	
    .tbl01 th{
        border: 0;
    }

    .tbl01 td{
        padding-top: 5%;
        padding-bottom: 5%;
    }
    
	
	.clmDLlist a {
		float: none;
		width: 100%;
		padding: 0 3%;
		display: block;
	}
	
	
	.cap01, .cap02{
		margin: 40px 0 20px;
		padding: 10px;
		font-size: 1.2em;
	}
	.cap02 + ul > li{
		margin-left:20px;
	}
	
	
	ul.clmPhoto li:nth-of-type(n){
		float: left;
		width: 47.5%;
		margin: 0 5% 0 0;
	}
	ul.clmPhoto li:nth-of-type(2n){
		margin-right:0;
	}
	ul.clmPhoto li:nth-of-type(2n+1){
		clear: both;
	}
	ul.clmPhoto li:nth-of-type(n+3) {
		margin-top: 20px;
	}
	
	#tokucyo{
		margin-top:40px;
	}
	#tokucyo .clmItem div:nth-of-type(1), #tokucyo .clmItem div:nth-of-type(2) {
		width:100%;
		float:none;
	}
	#tokucyo .clmItem div:nth-of-type(1){
		margin-bottom:30px;
	}
	#tokucyo .clmItem div p a{
		
	}
	
	.clmPoint {
		margin-top: 40px;
	}
	.clmPoint dd ul li, .clmPoint.notNumber dd ul li{
		width: 100%;
		float:none !important;
	}


	.collabo-nx-2 .topicCapton .title {
		font-size: 1.6em;
	}
	.collabo-nx-2 .topicCapton .box {
		margin-top:10px;
	}
	.collabo-nx-2 .topicCapton .title br{
		display: block;
	}

	.note01 ul{
		margin-left: 20px;
	}



    a.tel{
        text-decoration: underline;
    }
	
	.fluid-img{
		width:80%;
	}
}