@media print{
  @charset "UTF-8";

  body {
        zoom: 0.68;
        -webkit-print-color-adjust: exact;
    }
    @media print and (-ms-high-contrast: none) {

    body {
        zoom: 1.8;
        width: 1200px;
        transform: scale(0.5);
        transform-origin: 0 0;
    }
}
.print20mb{margin-bottom:100px;}

/*
******************
common/style.css
******************
*/
/* reset css-------------------------------------------- */
html, body, div, span, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
abbr, address, cite, code,
del, dfn, em, img, ins, kbd, q, samp,
small, strong, var,
b, i,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, figcaption, figure,
footer, header, hgroup, menu, nav, section, summary,
time, mark, audio, video {
 margin:0;
 padding:0;
 border:0;
 outline:0;
 vertical-align:baseline;
 background:transparent;
}
article,aside,details,figcaption,figure,
footer,header,hgroup,menu,nav,section {
 display:block;
}
ul, ol {
 list-style:none;
}
a {
 margin:0;
 padding:0;
 vertical-align:baseline;
 text-decoration: none;
 color: inherit;
}
table {
 border-collapse:collapse;
 border-spacing:0;
}
hr {
 display:block;
 height:1px;
 border:0;
 border-top:1px solid #cccccc;
 margin:1em 0;
 padding:0;
}

/*
*************************************************
common_css
*************************************************
*/
*{
  font-family : "ヒラギノ角ゴ ProN" , sans-serif;
}
section{
  margin: 0 0 50px 0;
}
.body{
  position: relative;
  overflow:hidden;
  box-sizing: border-box;
}
.wrap{
  position: relative;
  width: 1000px;
  margin: 0 auto;
}
img{width: 100%;}
.max_img{width: 100%;}

/* header------------------------ */
header h1{
  position: absolute;
  top:0;
  left:0;
}
header h1 img{width: 300px;}

/* footer------------------------ */
footer{
  width: 100%;
  background: #ededed;
  padding: 20px 0;
  font-size: 12px;
  margin-top: 80px;
}
/* topへ戻る */
#page_top{
  width: 50px;
  height: 50px;
  position: fixed;
  right: 0;
  bottom: 0;
  background: #666;
  opacity: 0.6;
}
#page_top a{
  position: relative;
  display: block;
  width: 50px;
  height: 50px;
  text-decoration: none;
}
#page_top a::before{
  font-family: 'Font Awesome 5 Free';
  font-weight: 900;
  content: '\f106';
  font-size: 25px;
  color: #fff;
  position: absolute;
  width: 25px;
  height: 25px;
  top: 0;
  bottom: 0;
  right: 0;
  left: 0;
  margin: auto;
  text-align: center;
}
 .pagenation {
  width: 100%;
  height: 50px;
}
 .pagenation a{
  position: relative;
  display: block;
  width: 100%;
  text-decoration: none;
  text-align: center;
  padding: 20px;
  border-radius: 10px;
  border:2px solid #666;
  box-sizing: border-box;
}
 .pagenation a::before{
  font-family: 'Font Awesome 5 Free';
  font-weight: 900;
  content: '\f107';
  font-size: 25px;
  color: #666;
  position: absolute;
  width: 25px;
  height: 25px;
  top: 0;
  bottom: 0;
  left: 20px;
  margin: auto;
  text-align: center;
}
/* h------------------------ */
h3{
  font-size: 36px;
}
h4{
  border-bottom: 1px solid #666;
    padding: 0 0 10px 14px;
    margin: 0 0 30px 0;
    font-size: 28px;
    border-left: 5px solid #c1dd78;
}
h5{
  font-size: 20px;
  margin-bottom: 30px;
  font-weight: bold;
  background: #ededed;
  padding: 10px 20px;
  width:100%;
  box-sizing: border-box;
  position: relative;
}
h6{
  font-size: 16px;
  font-weight: bold;
  margin: 0 0 10px 0 ;

}
.h4_1{
  font-size: 25px;
  margin-bottom: 30px;
  font-weight: bold;
}
.h5_1{
  margin: 0 0 20px 0;
  font-size: 20px;
  background: none;
  padding: 0;
}
.h5_1::before{
  content: '■';
  color: #c1dd78;
  margin: 0 5px 0 0 ;
}
.h5_2{
  margin: 0 0 20px 0;
  font-size: 20px;
  color: #c1dd78;
}
.kaihatu{
  color: #fff;
  background: red;
  padding: 3px 10px;
  border-radius: 20px;
  position: absolute;
  right: 10px;
  top:12px;
  font-size: 14px;
}

/* リスト */
ul.dot{
  list-style: disc;
  margin: 0 0 0 1.5em;
}
ul.dot li {
  list-style: disc;
}

/* レイアウト------------------------ */
.col2{
  display: flex;
  justify-content: space-between;
  margin-bottom: 80px;
}
.col2.center{
  justify-content: center;
}
.col2.wid{
  margin-bottom: 0px;
}

.col2.wid > div{
  width: 48%;
}
.col2 .midle{
  align-items: center;
}
.col2.midle{
  align-items: center;
}
.reflex{
  flex-flow: row-reverse;
  flex-wrap: wrap;
}
/* box------------------------ */
.box1{
  color: #fff;
  padding: 20px;
  text-align: center;
  background: #00460f;
  font-size: 25px;
  font-weight: bold;
}
.box2{
  padding: 20px;
  background: rgb(213, 243, 252);
  box-sizing: border-box;
}
.box3{
  background: #8bba2d;
  color: #fff;
  padding: 10px;
  border-radius: 50%;
  font-weight: bold;
}
.box4{
  border-radius: 10px;
  border:3px solid #8bba2d;
  margin: 0 0 40px 0;
  background: rgb(244, 250, 231);
}
.box4 .col2{
  align-items: center;
}
.box4 p{
  padding: 30px 0 30px 30px;
}
.box4 img{
  padding: 20px;
  width: 100%;
  box-sizing: border-box;
}

.movie div.col2 > div{
  width: 22%;
}
.movie img{
  -webkit-transition: all 0.3s ease;
    -moz-transition: all 0.3s ease;
    -o-transition: all 0.3s ease;
    transition: all  0.3s ease;
}
.movie img:hover{
  opacity: 0.6;
}
/* fade------------------------ */
.effect-fade {
  opacity : 0;
  transform : translate(0, 45px);
  transition : all 1000ms;
}
.effect-fade.effect-scroll {
  opacity : 1;
  transform : translate(0, 0);
}

/* table------------------------ */
table{
  width: 100%;
}
table, tr, th, td{
  border:1px solid #666;
  font-size: 14px;
}
th, td{
  padding: 4px 2px;
  vertical-align: middle;
  font-weight: normal;
}
td{
  text-align: center;
}
table.mtb1 th, table.mtb1 td{
  padding-top: 7px;
  padding-bottom: 7px;
}

table.no_brd, .no_brd tr, .no_brd th, .no_brd td, .no_brd tbody{
  border: none;
  font-size: 16px;
}
.no_brd th, .no_brd td{
  padding: 0px;
  vertical-align: top;
}
.no_brd td{
  text-align: left;
}
.no_brd .wid{
  white-space: nowrap;
    width: 100px;
}


.red{color: red;}
.green{color:#2e653a; }
.blue{color: #036eb8;}
.txt_c{text-align: center;}
.txt_l{text-align: left;}
.txt_r{text-align: right;}
.txt_b{
  font-weight: bold;
  margin:0 0 20px 0;
}
.txt120{font-size: 120%;}
.note{font-size: 12px;}
.bg_g{background: #daebc4;}
.bg_b{background: #f5f2e9;}
.bg_h{background: #ededed;}
.bg_th{background: #f1a3a3;}
.bg_td{background: #fff5f5;}
.ico{background: #8fc31f; color: #fff; font-size: 14px; font-weight: bold; border-radius: 50%; padding: 5px; display: inline-block;}
/* mail------------------------ */
.mail{color: #46b2e7;}
.mail:hover{text-decoration: underline;}

/*
*************************************************
事例common
*************************************************
*/
/* main------------------------ */
.main{
  position: relative;
  min-height: 300px;
  margin: 0 0 30px 0;
}
.main .wrap{
  min-height: 240px;
}
.main .wrap div{
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  min-height: 240px;
  justify-content: flex-end;
}
.main h2{
  color: #fff;
  display: block;
  width: 100%;
  font-size: 210%;
  margin:50px 0 0 0;
}
.main h2 span{
  font-size: 12px;
  display: block;
  width: 100%;
  margin: 0  ;
}
/* menu------------------------ */
.menu{
  display: flex;
  width: 100%;
  justify-content: space-around;
  position: absolute;
  bottom:0;
}
.menu li{
  width: 33.3333333%;
  text-align: center;
}
.menu a{
  color: #fff;
  font-size: 20px;
  font-weight: bold;
  display: block;
  padding: 14px;
  background: #666;
  transition: all .4s;
}
.menu li.active a, .menu li a:hover{
  background: #000;
}
/* パンくず------------------------ */
.branch{
  display: flex;
  margin-bottom: 30px;
  flex-wrap: wrap;
}
.branch li{
  margin:0 10px 0 0;
  padding: 0 20px 0 0;
  font-size: 12px;
  display: inline-block;
  position: relative;
}
.branch li a{
  font-size: 12px;
  color: #666;
  display: inline-block;
}
.branch li a::after{
  content: '›';
  color: #666;
	width: 1em;
	height: 1em;
	line-height: 1;
	text-align: center;
	font-size: 1em;
	position: absolute;
	top: 50%;
	right: 0;
	-webkit-transform: translateY(-50%);
	transform: translateY(-50%);
}
.branch li a:hover{
  text-decoration: underline;
}
/* リード------------------------ */
.read{
  display: flex;
  margin-bottom: 30px;
  align-items: center;
  flex-wrap: wrap;
}
.read > div:first-child{
  width: 30%;
  margin-right: 2%;
}
.read > div:last-child{
  width: 68%;
}
.read img{
  width: 100%;
}
.read p{
  font-size: 26px;
}
/*
*************************************************
事例_各TOPページ
*************************************************
*/
.item_list{
  display: flex;
  justify-content: space-between;
  margin-bottom: 60px;
}
.item_list > div{
  width: 22%;
}
.item_list img{
  width: 100%;
  margin-bottom: 10px;
}
.item_list h3{
  font-size: 18px;
  margin-bottom: 23px;
  min-height: 3em;
}
.item_list p{
  font-size: 16px;
  line-height: 1.7em;
  margin-bottom: 14px;
}
.item_list ul{
  font-size: 14px;
  list-style: none;
  padding:0;
  margin:0;
}
.item_list ul li{
  padding-left: 1em;
    text-indent: -.7em;
    margin-bottom: 8px;
}
.item_list ul li::before{
  content: "● ";
    color: #c1dd78;
    font-size: 10px;
}
.item_list a{
  transition: all .4s;
}
.item_list a:hover{
  opacity: 0.6;
}

.txt120per{font-size: 120%;}
.txt140per{font-size: 140%;}


.menu li.active a, .menu li a:hover {
    background: linear-gradient(to right, #00b8ff, #6666ff);
}

/*
*************************************************
PC用css
*************************************************
*/

.sp{display: none;}

.w3{width:3%;}
.w5{width:5%;}
.w10{width:10%;}
.w19{width:19%;}
.w20{width:20%;}
.w22{width:22%;}
.w26{width:26%;}
.w28{width:28%;}
.w30{width:30%;}
.w32{width:32%;}
.w34{width:34%;}
.w35{width:35%;}
.w36{width:36%;}
.w38{width:38%;}
.w40{width:40%;}
.w42{width:42%;}
.w46{width:46%;}
.w45{width:45%;}
.w48{width:48%;}
.w50{width:50%;}
.w52{width:52%;}
.w56{width:56%;}
.w58{width:58%;}
.w60{width:60%;}
.w64{width:64%;}
.w66{width:66%;}
.w68{width:68%;}
.w70{width:70%;}
.w80{width:80%;}
.w90{width:90%;}
.w100{width:100%;}
.mt0{margin-top: 0px;}
.mt10{margin-top: 10px;}
.mt20{margin-top: 20px;}
.mt30{margin-top: 30px;}
.mt40{margin-top: 40px;}
.mt50{margin-top: 50px;}
.mt60{margin-top: 60px;}
.mt70{margin-top: 70px;}
.mt80{margin-top: 80px;}
.mt90{margin-top: 90px;}
.mt100{margin-top: 100px;}
.mb0{margin-bottom: 0px;}
.mb10{margin-bottom: 10px;}
.mb20{margin-bottom: 20px;}
.mb30{margin-bottom: 30px;}
.mb40{margin-bottom: 40px;}
.mb50{margin-bottom: 50px;}
.mb60{margin-bottom: 60px;}
.mb70{margin-bottom: 70px;}
.mb80{margin-bottom: 80px;}
.mb90{margin-bottom: 90px;}
.mb100{margin-bottom: 100px;}

.mr10{margin-right: 10px;}
.mr20{margin-right: 20px;}

/* } */
@media all and (-ms-high-contrast: none){
  .main h2{
    margin:116px 0 0 0;
  }
  .main_read {
    margin-top: 120px;
  }
}
