@charset "utf-8";

.container {
    max-width: 1240px;
    margin: auto;
}

.font18-16 {
    font-size: 18px;
}
@media (max-width:768px){
    .font18-16{
        font-size: 15px;
    }    
}

img {
    max-width: 100%;
}
.lineh {
    line-height: 5px;
}
.copy {
    font-size: 18px;
    line-height: 1.5;
}

.subfont {
    font-size: 3.8vw;
}
.attention {
    font-size: 4vw;
}
.ol_title {
    font-size: 4.5vw;
}
.li_font {
    font-size: 4vw;
}
.display4 {
    font-size: 5vw;
}
.display3 {
    font-size: 6.3vw;
    line-height:1.5;
}
.display2 {
    font-size: 8vw;
    line-height:1.5;
}
.display1 {
    font-size: 15vw;
    line-height:1;
}

.min {

    font-family: 'Kaisei Tokumin', serif;
}
.min2{
    font-family: 'Shippori Mincho B1', serif;
    font-weight:800;
}
.caption {
    font-size: 0.6rem;
    line-height: 0.9rem;
}
/*--span--*/


.arrow {
    width: 80px;
}
.arrowfont {
    font-size: 4vw;
}
.border2_3 {
    border: solid 3px #bed9ed;
    border-radius: 10px;
}



@media (min-width:768px) {
    
    .ol_title {
        font-size: 2.2vw;
    }
    .li_font {
        font-size: 1.9vw;
    }
    .attention {
        font-size: 2.5vw;
    }
    .subfont {
        font-size: 2.2vw;
    }
    .display4 {
        font-size: 3vw;
    }
    .display3 {
        font-size: 4vw;
    }
    .display2 {
        font-size: 5vw;
    }
    .display1 {
        font-size: 8vw;
    }
   
    .arrow {
        width: 150px;
    }
    .arrowfont {
        font-size: 3vw;
    }
    .caption {
        font-size: 0.8rem;
        line-height: 1.1rem;
    }
    .copy {
        font-size: 20px;
        line-height: 1.6;
    }
    .ozonresult {
        width: 100px;
    }

}
@media (min-width:1200px) {
    
   .ol_title {
        font-size: 28px;
    }
    .li_font {
        font-size: 25px;
    }
    .attention {
        font-size: 30px;
    }
    .subfont {
        font-size: 28px;;
    }
    .display4 {
        font-size: 40px;
    }
    .display3 {
        font-size: 50px;
    }
    

}



/*color*/

.title-blue {
    color: #015f92;
}
.ozonresult {
    width: 20px;
    padding: 5px;
}
/*--LightnicOZ--*/

.border_grey {
    border: solid 3px #dcdcdc;
}

.rotate90 {
    transform:rotate(-90deg);
}
.bg_ozon {
    background-color:#bed9ed;
}
.bg_ozontable {
    background-color: #ffff99
}
.button_oz {
    background-color:#bed9ed;
    border-radius: 30px;
    text-align: center;
    padding: 8px;
    color: #666;
}

#oz_move iframe {
    width: 100%; /* 任意の横幅を指定 */
    height: auto;
    aspect-ratio: 16/9;
  }

.marker {
	background: linear-gradient(transparent 65%, #d7c447 65%);
    padding: 0 2px; 
}
.marker_blue {
    background: linear-gradient(transparent 65%, #c1e0ff 65%);
   font-weight: bold; 
   }
.marker_red {
    background: linear-gradient(transparent 70%, #ffe4e1 70%);
    padding: 0 2px;
    font-weight: bold; 
}
.marker_blue{
    background:linear-gradient(transparent 75%, #bce2e8 75%);
    font-weight:bold; 
    }

/*もっと読む*/
.cp_box *, .cp_box *:before, .cp_box *:after {
	-webkit-box-sizing: border-box;
	box-sizing: border-box;
}
.cp_box {
	width: auto;
	margin: 1em auto;
}
.cp_box label {
	font-weight: bold;
	position: relative;
	display: block;
	width: 60%;
	margin: auto;
	padding: 0.3em 1em;
	cursor: pointer;
	transition: all 0.3s;
	text-align: center;
	color: #da3c41;
	border: 1px solid #da3c41;
	border-radius: 10px;
}
.cp_box label:hover {
	transition: all 0.3s;
	color: #ffffff;
	background: #da3c41;
}
/*.cp_box label::after {
	font-family: 'FontAwesome';
	content: ' \f067';
	color: #da3c41;
}*/
.cp_box label:hover::after {
	color: #ffffff;
}
/*.cp_box input:checked ~ label::after {
	font-family: 'FontAwesome';
	content: ' \f068';
	color: #da3c41;
}*/
.cp_box input:checked ~ label:hover::after {
	color: #ffffff;
}
.cp_box input {
	display: none;
}
.cp_box .cp_container {
	position: relative;
	z-index: 10;
	overflow: hidden;
	height: 0;
	margin-top: -1px;
	transition: height 0.3s ease-in-out,box-shadow 0.6s linear;
	background: rgba(255, 255, 255, 0.5);
}
.cp_box input:checked ~ div {
	transition: height 0.5s ease-in-out,box-shadow 0.1s linear;
}
/* 続きを読むを押すと表示されるテキストの高さ */
.cp_box input:checked ~ div.cp_container {
	height: auto;
}
.borderright {
    border-right: solid 5px #fff;
}


/*lightnicozmonitor*/

.monitortitile {
    border-bottom: solid 2px #777;
}
/* --- ドット（水玉）*/
.whitedots {
    margin: auto;
    max-width: 100%;
    height: 100%;
                                        /* ドット（水玉）模様のCSS */
    background-color: #bed9ed;
    background-image: radial-gradient(#d5e3ed 9%, transparent 14%), radial-gradient(#d5e3ed 9%, transparent 14%);
    background-position: 0 0, 19px 19px;
    background-size: 38px 38px;
  }

