@charset "utf-8";
/* CSS Document */

html,body { height:100%; }

*,#marchat_area *:before, *:after {
    -webkit-box-sizing: border-box;
       -moz-box-sizing: border-box;
         -o-box-sizing: border-box;
        -ms-box-sizing: border-box;
            box-sizing: border-box;
			margin:0;
			padding:0px;
}
img {
	vertical-align:top;
}

.clear {clear:both;}
.ta-c {text-align:center !important;}
.ta-l {text-align:left !important;}
.ta-r {text-align:right !important;}

.tc-red {color:#F00 !important;}
.tc-blue {color:#00F !important;}

.font-b {font-weight:bold !important;}

.bg-white { background-color:#FFF !important;}

.no_disp {display:none;}

.font_size_s {font-size:12px;}
.font_size_ss {font-size:10px;}

.mt05 {margin-top:5px;}
.mt10 {margin-top:10px;}
.mt15 {margin-top:15px;}
.mt20 {margin-top:20px;}
.mt30 {margin-top:30px;}
.mt40 {margin-top:40px;}
.mt50 {margin-top:50px;}
.mt60 {margin-top:60px;}

::-webkit-input-placeholder { /* WebKit, Blink, Edge */
    color:#ccc;
}
:-ms-input-placeholder { /* Internet Explorer 10-11 */
   color:#ccc;
}
::placeholder{ /* Others */
 color:#ccc
}

a:hover {
	animation: mouseOverfade 0.7s ease 0s 1 normal;
	-webkit-animation: mouseOverfade 0.7s ease 0s 1 normal;
}
@keyframes mouseOverfade {
    0% {opacity: 0.3}
    100% {opacity: 1}
}

@-webkit-keyframes mouseOverfade {
    0% {opacity: 0.3}
    100% {opacity: 1}
}

.obj_fit_cover {
	object-fit: cover;
    object-position: 50% 50%;
    font-family: 'object-fit: cover; object-position: 50% 50%;';
}

.flex-space {
	display: flex;
	flex-wrap: wrap;
	justify-content: space-around;
	list-style:none;
}
.flex-between {
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
	list-style:none;
}
.flex-center {
	display: flex;
	flex-wrap: wrap;
	justify-content:center;
	list-style:none;
}
.flex-center li {
	margin-left:10px;
	margin-right:10px;
}
.col2 li {
	width:calc(100% / 2 - 21px);
	position:relative;
}
.col3 li {
	width:calc(100% / 3 - 21px);
	position:relative;
}
.col4 li {
	width:calc(100% / 4 - 21px);
	position:relative;
}


.img_box {
	position:relative;
	width:100%;
	height:100%;
}
.img_box img {
	position:absolute;
	max-width:100%;
	max-height:100%;
	top:50%;
	left: 50%;
    -webkit-transform: translate(-50%,-50%);
    -moz-transform: translate(-50%,-50%);
    transform: translate(-50%,-50%);
}


 input[type="text"]
,input[type="email"]
,input[type="password"]
,textarea {
	padding:5px 6px;
	border:solid 1px #999999;
	border-radius:3px;
	font-size:16px;
}
textarea {
	width:90%;
	height:40px;
}
input[type="file"] {
	height:30.4px;
}
select {
	padding:4.6px 6px;
	border:solid 1px #999999;
	border-radius:3px;
	font-size:16px;
}
label {
	display:inline-block;
	font-size:16px;
	line-height:30.4px;
	margin-right:15px;
}
label input[type="radio"]
,label input[type="checkbox"] {
	margin-right:3px;
	width:17px;
	height:17px;
	vertical-align:middle;
}

input[type="text"].v1 {
	width:calc(100% - 14px);
}
textarea.v1 {
	width:calc(100% - 14px);
	height:100px;
}


 input[type="submit"]
,input[type="button"] {
	padding:0px 15px;
	height:40px;
	line-height:40px;
	border-radius:3px;
	font-size:16px;
	
	color: #FFFFFF;
    background-color: #1DC7EA;
	border:solid 3px #1DC7EA;
}
input[type="button"].modoru {	
    border:solid 3px #1DC7EA;
    color: #1DC7EA;
	background-color:#FFF;
}
input[type="button"].v1 {	
    color: #FFFFFF;
    background-color: #1DC7EA;
	border:solid 3px #1DC7EA;
}
input[type="button"].v2 {	
    border:solid 3px #888888;
    color: #FFFFFF;
	background-color:#888888;
}
input[type="button"].v3 {	
    border:solid 3px #87CB16;
    color: #FFFFFF;
	background-color:#87CB16;
}