@charset "UTF-8";

/*
@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+JP:wght@100;300;400;500;700;900&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Roboto:ital,wght@0,100;0,300;0,400;0,500;0,700;0,900;1,100;1,300;1,400;1,500;1,700;1,900&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Roboto:wght@100;300;400;500;700;900&display=swap');
*/

@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+JP:wght@100;300;400;500;700;900&family=Roboto:wght@100;300;400;500;700;900&display=swap');

@import url('https://fonts.googleapis.com/css2?family=Oswald&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Oswald:wght@500&display=swap');

@import url('https://fonts.googleapis.com/css2?family=Poppins&display=swap');

/*

    font-family: 'Roboto', sans-serif;

    font-family: 'Roboto Condensed', sans-serif;

    font-family: 'Fredericka the Great', cursive;

    font-family: 'Monoton', cursive;

    font-family: 'Press Start 2P', cursive;

    font-family: 'Gruppo', cursive;

    font-family: 'Monofett', cursive;

	font-family: 'Teko', sans-serif;

	font-family: 'Anton', sans-serif;

    font-family: 'Oswald', sans-serif;

    font-family: 'Poppins', sans-serif;

*/

/*
========================================

	base.css
	--> Base layout setting
	--> Bootstrap reset and modify
 
========================================
*/

html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed,
figure, figcaption, footer, header, hgroup,
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
	margin: 0;
	padding: 0;
	border: 0;
}

html {font-size: 100%;}/*100%=16px*/

body {
	font-family:'Noto Sans JP','ヒラギノ角ゴ Pro W3','Hiragino Kaku Gothic Pro','Osaka','メイリオ','Meiryo','ＭＳ Ｐゴシック','MS PGothic',Sans-Serif;
	font-size: 1rem;
	font-weight: 400;
  	line-height: 1.5;
    color: #333;
}

@-ms-viewport {/*for IE only 右側のスクロールバーがコンテンツに重なるのを防ぐ*/
    width: auto;
    initial-scale: 1;
}

@viewport {
    width: device-width;
    initial-scale: 1;
}

h1, h2, h3, h4, h5, h6,
.h1, .h2, .h3, .h4, .h5, .h6 {
	margin-bottom: 0;
	font-weight: 500;
 }

h1,.h1 {
	font-size:2.625rem;/*16*2.625=42px*/
	line-height : 1;/*42px*/
}

h2,.h2 {
	font-size:2.1875rem;
	line-height : 1.44;
}

h3,.h3 {
	font-size:1.75rem;/*28px*/
	line-height : 1.5
}

h4,.h4 {
	font-size:1.3125rem;/*21px*/
	line-height: 1.6;
}

h5,.h5 {
	font-size:1.09375rem;/*17.5px*/
	line-height: 1.68;
}

h6,.h6 {
	font-size:1rem;
}

p, ol, ul , dt, dd, table {
	font-size:0.875rem;
    line-height: 1.75;
}

dt {
	font-size:1.09375rem;
	line-height: 1.68;
	margin-bottom: 0.75rem;
}

ol, ul {list-style: none;}

a {
    color: inherit;
    text-decoration: none;
}
a:hover,
a:focus {
    color: inherit;
    text-decoration: none;
    outline: 0 !important;
}
a:focus {
    /*outline: 5px auto -webkit-focus-ring-color;
    outline-offset: -2px;*/
}

.lead {
	font-size: inherit;
    font-weight: inherit;
}

@media (min-width: 992px) {

h1,.h1  {font-size : 3rem; }
h2,.h2 {font-size : 2.5rem;}
h3,.h3 {font-size : 2rem;}
h4,.h4 {font-size : 1.5rem;}
h5,.h5 {font-size : 1.25rem;}
/*h6 {font-size :1.125rem;}*/
h6,.h6 {font-size:1.09375rem;/*17.5px*/}
	
p, ol, ul , dd, table {font-size :1rem;}
dt {font-size : 1.25rem;}
ol, ul {list-style: none;}

.lead {
    /*font-size:inherit;
    padding: 0 1rem 3rem 1rem;2rem = p-5*/
}
    
}/*@media end*/

.display-1,
.display-2,
.display-3,
.display-4,
.display-5,/*5からは追加設定*/
.display-6,
.display-7,
.display-8,
.display-9 {line-height: 1.5;}

.display-1 {font-size: 6rem;}
.display-2 {font-size: 5.5rem;}
.display-3 {font-size: 4.5rem;}
.display-4 {font-size: 3.5rem;}

.display-5 {font-size: 3rem;}/*48px*/
.display-6 {font-size: 2.75rem;}/*44px*/
.display-7 {font-size: 2.25rem;}/*36px*/
.display-8 {font-size: 1.75rem;}/*28px*/
.display-9 {font-size: 1.5rem;}/*24px*/
.display-10 {font-size: 1.25rem;}/*20px*/


@media (max-width: 1199.98px) {

 .display-1 {font-size:calc(1.725rem + 5.7vw);}
 .display-2 {font-size:calc(1.675rem + 5.1vw);}
 .display-3 {font-size:calc(1.575rem + 3.9vw);}
 .display-4 {font-size:calc(1.475rem + 2.7vw);}

 .display-5 {font-size:calc(1.375rem + 1.5vw);}
 .display-6 {font-size:calc(1.325rem + 1.1vw);}
 .display-7 {font-size:calc(1.325rem + .9vw);}
 .display-8 {font-size:calc(1.3rem + .6vw);}
 .display-9 {font-size:calc(1.275rem + .3vw);}
 .display-10 {font-size:calc(1.1rem + .25vw);}

}/*@media end*/

small,
.small { 
    font-size: 87.5% !important;
    color: inherit !important;
	font-weight: inherit;
}

.s_small {font-size:75% !important;}

.ss_small {font-size:50% !important;}

.m_large {font-size:112.5% !important;}

.notes{
	font-size:50% !important;
	font-weight: 400 !important;
	vertical-align: -25%;
	font-feature-settings:"palt";
}

large,
.large {
    font-size: 125% !important;
}

@media (min-width: 992px) {

    .lg-large {
        font-size: 125% !important;
    }

}/*@media end*/

.fw100 {font-weight: 100;}
.fw300 {font-weight: 300;}
.fw400 {font-weight: 400;}
.fw500 {font-weight: 500;}
.fw600 {font-weight: 600;}
.fw700 {font-weight: 700;}
.fw800 {font-weight: 800;}
.fw900 {font-weight: 900;}

.lbreak {display:inline-block;}

span.kerning {/*行頭に括弧などがある場合*/
    /*
	display:inline-block;
    margin-left: -0.5rem;
	*/	
	font-feature-settings:"palt";
	/*letter-spacing:0.0625rem;*/
}

.border-w2 {border-width: 2px !important;}
.border-w3 {border-width: 3px !important;}
.border-w4 {border-width: 4px !important;}
.border-w5 {border-width: 5px !important;}
.border-w6 {border-width: 6px !important;}
.border-w8 {border-width: 8px !important;}
.border-w10 {border-width: 10px !important;}

.lspace_normal {
    line-height: 1.75 !important;
}

.lspace_l {
    line-height: 2 !important;
}

/*----------------------------------------

bootstrapで設定されている項目★

.w-25 {width: 25% !important;}
.w-50 {width: 50% !important;}
.w-75 { width: 75% !important;}
.w-100 {width: 100% !important;}
.w-auto { width: auto !important;}

.h-25 {height: 25% !important;}
.h-50 { height: 50% !important;}
.h-75 {height: 75% !important;}
.h-100 { height: 100% !important;}
.h-auto {height: auto !important;}

.mw-100 {max-width: 100% !important;}
.mh-100 {max-height: 100% !important;}
.min-vw-100 {min-width: 100vw !important;}
.min-vh-100 {min-height: 100vh !important;}

.vw-100 {width: 100vw !important;}
.vh-100 {height: 100vh !important;}

↓上記★を前提に以下を追加設定

----------------------------------------*/

.mw-25 {max-width: 25% !important;}
.mh-25 {max-height: 25% !important;}

.mw-75 {max-width: 75% !important;}
.mh-75 {max-height: 75% !important;}

.mw-100 {max-width: 100% !important;}
.mh-100 {max-height: 100% !important;}

.min-w-100 {min-width: 100% !important;}
.min-h-100 {min-height: 100% !important;}

.min-w-75 {min-width: 75% !important;}
.min-h-75 {min-height: 75% !important;}

@media (min-width: 576px) {

.w-sm-25 {width: 25% !important;}
.w-sm-50 {width: 50% !important;}
.w-sm-75 {width: 75% !important;}
.w-sm-100 {width: 100% !important;}

.h-sm-25 {height: 25% !important;}
.h-sm-50 {height: 50% !important;}
.h-sm-75 {height: 75% !important;}
.h-sm-100 {height: 100% !important;}
	
.mw-sm-100 {max-width: 100% !important;}

}/*@media end*/

@media (min-width: 768px) {
    
.w-md-25 {width: 25% !important;}
.w-md-50 {width: 50% !important;}
.w-md-75 {width: 75% !important;}
.w-md-100 {width: 100% !important;}

.h-md-25 {height: 25% !important;}
.h-md-50 {height: 50% !important;}
.h-md-75 {height: 75% !important;}
.h-md-100 {height: 100% !important;}
	
.mw-md-100 {max-width: 100% !important;}
    
}/*@media end*/

@media (min-width: 992px) {
    
.w-lg-25 {width: 25% !important;}
.w-lg-50 {width: 50% !important;}
.w-lg-75 {width: 75% !important;}
.w-lg-100 {width: 100% !important;}

.h-lg-25 {height: 25% !important;}
.h-lg-50 {height: 50% !important;}
.h-lg-75 {height: 75% !important;}
.h-lg-100 {height: 100% !important;}
	
.mw-lg-100 {max-width: 100% !important;}
    
}/*@media end*/

@media (min-width: 1200px) {

.w-xl-25 {width: 25% !important;}
.w-xl-50 {width: 50% !important;}
.w-xl-75 {width: 75% !important;}
.w-xl-100 {width: 100% !important;}

.h-xl-25 {height: 25% !important;}
.h-xl-50 {height: 50% !important;}
.h-xl-75 {height: 75% !important;}
.h-xl-100 {height: 100% !important;}
	
.mw-xl-100 {max-width: 100% !important;}
    
}/*@media end*/

/*----------------------------------------
	layout
----------------------------------------*/

.wrapper {/*コンテンツ全体の幅*/
	width:100%;
	margin: 0 auto;
	/*border: 1px dotted #000;ガイド*/
}

main {
    /*margin-bottom: 56px;-----pagetopボタンの高さ*/
}

aside {
	/*background: #fff;
	border: 1px dotted #000;ガイド*/
}

.container, 
.container-fluid,
.container-sm, .container-md, .container-lg, .container-xl {
	padding-left: 0;
	padding-right: 0;
	/*border: 1px dotted #000;ガイド*/
}

@media (min-width: 576px) {
	
  .container {
    max-width: none;
  }
	
}/*@media end*/

@media (min-width: 768px) {
	
  .container {
    max-width: none;
  }
	
}/*@media end*/

@media (min-width: 992px) {

.container {
	/*width: 96%;----------------totecサイトのdiv.headerBoxに合わせる場合*/
  }

main {
    /*margin-bottom: 70px;pagetopボタンの高さ*/
}

}/*@media end*/

@media (min-width: 1200px) {
	
  .container {
    max-width: 1600px !important;
  }
	
}/*@media end*/

/*----------------------------------------
	grid
----------------------------------------*/

.row {
  margin-right: 0;
  margin-left: 0;
}

.col-1, .col-2, .col-3, .col-4, .col-5, .col-6, .col-7, .col-8, .col-9, .col-10, .col-11, .col-12, .col,
.col-auto, .col-sm-1, .col-sm-2, .col-sm-3, .col-sm-4, .col-sm-5, .col-sm-6, .col-sm-7, .col-sm-8, .col-sm-9, .col-sm-10, .col-sm-11, .col-sm-12, .col-sm,
.col-sm-auto, .col-md-1, .col-md-2, .col-md-3, .col-md-4, .col-md-5, .col-md-6, .col-md-7, .col-md-8, .col-md-9, .col-md-10, .col-md-11, .col-md-12, .col-md,
.col-md-auto, .col-lg-1, .col-lg-2, .col-lg-3, .col-lg-4, .col-lg-5, .col-lg-6, .col-lg-7, .col-lg-8, .col-lg-9, .col-lg-10, .col-lg-11, .col-lg-12, .col-lg,
.col-lg-auto, .col-xl-1, .col-xl-2, .col-xl-3, .col-xl-4, .col-xl-5, .col-xl-6, .col-xl-7, .col-xl-8, .col-xl-9, .col-xl-10, .col-xl-11, .col-xl-12, .col-xl,
.col-xl-auto {
  padding-right: 0;
  padding-left: 0;
}

/*----------------------------------------
	table
----------------------------------------*/

.table {
	background-color:#fff;
	margin-bottom: 0;
}

.table th {
	white-space:nowrap;
	font-weight: 400;
}

.table th,
.table td {
  padding:1rem;
}

.table-sm th,
.table-sm td {
  padding: 0.5rem;
}

/*カード型テーブルを追加設定*/

.table.tableCard {background:none;}

.table.tableCard th {background-color:#ccc;}
.table.tableCard td {background-color:#fff;}

.table.tableCard th,
.table.tableCard td {
	border: 1px solid #333;
}

@media (max-width:991.98px) {

.table.tableCard th,
.table.tableCard td {
	width: 100%;
	display: block;
}
	
.table.tableCard th {
	border-bottom: none;
}
	
.table.tableCard td {
	border-top: none;
}

}/*@media end*/

/*入れ子用テーブルを追加設定*/

.table.tableInner th,
.table.tableInner td {
	border: none !important;
	background: none !important;
	padding: 0.25rem;
}

/*----------------------------------------
	card
----------------------------------------*/

.card {
	border: none;
	height: 100%;/*高さを揃える*/
}

.card-body {
	padding: 1rem;
}

/*----------------------------------------
	breadcrumb
----------------------------------------*/

.breadcrumb {/*表示・非表示の設定はd-none d-lg-flexと同じ*/
	background-color: #fff;
	border-radius: 0;
	margin: 0;
	min-height: 40px;
    padding:0.5rem 0.5rem 0.5rem 1rem;
	line-height: 2;
    font-size:0.75rem;
    display: none;
}

    .breadcrumb > li + li:before {
    content: "\0203a";/*小さい＞記号　10進数では　›*/
    padding: 0 8px;
    color: #25348e;
}

.breadcrumb > .active {
    color: #25348e;
}

@media (min-width: 992px) {
	
    .breadcrumb {
		display: flex;
		padding:0 0.5rem 0 1rem;
		line-height: 40px;
    }
	
}/*@media end*/

/*
========================================

	base.css
    
========================================
*/

/* 
子要素を中央に置く 
flexCenter ＝ d-flex flex-column justify-content-center align-items-center（長いよ…）
*/

.flexCenter {
	display: flex;
    flex-direction: column; /* 子要素を縦方向に揃える */
    justify-content: center; /* 子要素を中央に配置 */
    align-items: center;  /* 子要素を中央に配置 */
    -ms-flex-direction: inherit; /*for IE only   ...これはimg.ofiのためだけの設定...*/
	
	/*border: 1px dotted #000;ガイド*/
  }

/*
参考（bootstrapで設定されているクラス）

.d-flex {display: flex !important;}
.flex-column {flex-direction: column !important;}
.justify-content-center {justify-content: center !important;}
.align-items-center {align-items: center !important;}

*/

/*
p.browserupgrade {for IE9
	font-size:0.625rem;
	line-height: 1.2;
	color: #666;
	text-align: left;
	
	position: absolute;
	top: 4px;
	left: 32%;
	margin-right: 50px;
}
*/

/*----------------------------------------
	header --->nav.cssで設定
----------------------------------------*/

/*----------------------------------------
	footer--->nav.cssで設定
----------------------------------------*/

/*------------------------------------------------------------------------
	CTA
	（お問い合わせへ移動するボタン）--->nav.cssで設定
--------------------------------------------------------------------------*/

/*----------------------------------------
	titleBox
	（このサイトでは使用しない）
----------------------------------------*/

/*-------------------------------------------------------------------------
	broken grid
	（このサイトでは仕様が変わる）--->case.cssで設定するか共用でbase.cssに設定するか検討中
------------------------------------------------------------------------*/

/*----------------------------------------
　contact--->jc.cssで設定
----------------------------------------*/

/*----------------------------------------
	person image protecter
----------------------------------------*/

.personBox {
	display:block;
	position:relative;
	width:100%;
	height:100%;
	margin:0;
	padding:0;
}

img.protecter {
    position:absolute;
    top:0;
    left:0;
    width:100%;
    height:100%;
}

/*----------------------------------------
　size image and block
----------------------------------------*/

.size80,
.size96,
.size120,
.size160,
.size180,
.size200,
.size240,
.size280,
.size320,
.size360,
.size400,
.size480,
.size560,
.size600,
.size640,
.size720,
.size800,
.size880,
.size960,
.size1080,
.size1140,
.size1280 {
    display: block;
    width: 100%;
    margin: auto;
}

.lg-size80,
.lg-size96,
.lg-size120,
.lg-size160,
.lg-size180,
.lg-size200,
.lg-size240,
.lg-size280,
.lg-size320,
.lg-size360,
.lg-size400,
.lg-size480,
.lg-size560,
.lg-size600,
.lg-size640,
.lg-size720,
.lg-size800,
.lg-size880,
.lg-size960,
.lg-size1080,
.lg-size1140,
.lg-size1280 {
    display: block;
    width: 100%;
    margin: auto;
	max-width: none;
}

.xl-size80,
.xl-size96,
.xl-size120,
.xl-size160,
.xl-size180,
.xl-size200,
.xl-size240,
.xl-size280,
.xl-size320,
.xl-size360,
.xl-size400,
.xl-size480,
.xl-size560,
.xl-size600,
.xl-size640,
.xl-size720,
.xl-size800,
.xl-size880,
.xl-size960,
.xl-size1080,
.xl-size1140,
.xl-size1280 {
    display: block;
    width: 100%;
    margin: auto;
	max-width: none;
}

.size80 {max-width:80px !important;}
.size96 {max-width:96px !important;}
.size120 {max-width:120px !important;}
.size160 {max-width:160px !important;}
.size180 {max-width:180px !important;}
.size200 {max-width:200px !important;}
.size240 {max-width:240px !important;}
.size280 {max-width:280px !important;}
.size320 {max-width:320px !important;}
.size360 {max-width:360px !important;}
.size400 {max-width:400px !important;}
.size480 {max-width:480px !important;}
.size560 {max-width:560px !important;}
.size600 {max-width:600px !important;}
.size640 {max-width:640px !important;}
.size720 {max-width:720px !important;}
.size800 {max-width:800px !important;}
.size880 {max-width:880px !important;}
.size960 {max-width:960px !important;}
.size1080 {max-width:1080px !important;}
.size1140 {max-width:1140px !important;}
.size1280 {max-width:1280px !important;}


@media (min-width: 992px) {

.lg-size80 {max-width:80px !important;}
.lg-size96 {max-width:96px !important;}
.lg-size120 {max-width:120px !important;}
.lg-size160 {max-width:160px !important;}
.lg-size180 {max-width:180px !important;}
.lg-size200 {max-width:200px !important;}
.lg-size240 {max-width:240px !important;}
.lg-size280 {max-width:280px !important;}
.lg-size320 {max-width:320px !important;}
.lg-size360 {max-width:360px !important;}
.lg-size400 {max-width:400px !important;}
.lg-size480 {max-width:480px !important;}
.lg-size560 {max-width:560px !important;}
.lg-size600 {max-width:600px !important;}
.lg-size640 {max-width:640px !important;}
.lg-size720 {max-width:720px !important;}
.lg-size800 {max-width:800px !important;}
.lg-size880 {max-width:880px !important;}
.lg-size960 {max-width:960px !important;}
.lg-size1080 {max-width:1080px !important;}
.lg-size1140 {max-width:1140px !important;}
.lg-size1280 {max-width:1280px !important;}

}/*@media end*/

@media (min-width: 1200px) {

.xl-size80 {max-width:80px !important;}
.xl-size96 {max-width:96px !important;}
.xl-size120 {max-width:120px !important;}
.xl-size160 {max-width:160px !important;}
.xl-size180 {max-width:180px !important;}
.xl-size200 {max-width:200px !important;}
.xl-size240 {max-width:240px !important;}
.xl-size280 {max-width:280px !important;}
.xl-size320 {max-width:320px !important;}
.xl-size360 {max-width:360px !important;}
.xl-size400 {max-width:400px !important;}
.xl-size480 {max-width:480px !important;}
.xl-size560 {max-width:560px !important;}
.xl-size600 {max-width:600px !important;}
.xl-size640 {max-width:640px !important;}
.xl-size720 {max-width:720px !important;}
.xl-size800 {max-width:800px !important;}
.xl-size880 {max-width:880px !important;}
.xl-size960 {max-width:960px !important;}
.xl-size1080 {max-width:1080px !important;}
.xl-size1140 {max-width:1140px !important;}
.xl-size1280 {max-width:1280px !important;}

}/*@media end*/

/*----------------------------------------
　image trimming
----------------------------------------*/

img.ofi {/*for IE---------ofi.min.js*/
	width: 100%;
	height: auto;
	/*初期設定*/
	object-fit: cover;
	object-position: center;
	font-family: 'object-fit: cover; object-position: center;';/*for IE only*/
	margin: 0;/*必須*/
}

/*画像左寄せ*/
img.ofi.ofi_left {/*for IE---------ofi.min.js*/
	width: 100%;
	height: auto;
	/*初期設定*/
	object-fit: cover;
	object-position: left center;
	font-family: 'object-fit: cover; object-position: left center;';/*for IE only*/
	margin: 0;/*必須*/
}


/*画像左上寄せ*/
img.ofi_left_top {
    width: 100%;
    height: auto;
    object-fit: cover;
    object-position: left top;
    font-family: 'object-fit: cover; object-position:left top;';/*for IE only*/
	margin: 0;/*必須*/
}

/*画像右寄せ*/
img.ofi.ofi_right {/*for IE---------ofi.min.js*/
	width: 100%;
	height: auto;
	/*初期設定*/
	object-fit: cover;
	object-position: right center;
	font-family: 'object-fit: cover; object-position: right center;';/*for IE only*/
	margin: 0;/*必須*/
}

/*画像上寄せ*/
img.ofi.ofi_top {/*for IE---------ofi.min.js*/
	width: 100%;
	height: auto;
	/*初期設定*/
	object-fit: cover;
	object-position: center top;
	font-family: 'object-fit: cover; object-position: center top;';/*for IE only*/
	margin: 0;/*必須*/
}

/*画像下寄せ*/
img.ofi.ofi_bottom {/*for IE---------ofi.min.js*/
	width: 100%;
	height: auto;
	/*初期設定*/
	object-fit: cover;
	object-position: center bottom;
	font-family: 'object-fit: cover; object-position: center bottom;';/*for IE only*/
	margin: 0;/*必須*/
}


.thumb {
    background-repeat: no-repeat;
    background-position: center center;/*個々に指定*/
    background-size: cover;/*個々に指定*/
    /*height: 100%;必ず個々に指定*/
}

/*----------------------------------------
　filter
----------------------------------------

.saturate {-webkit-filter: saturate(3); filter: saturate(3);}
.grayscale {-webkit-filter: grayscale(100%); filter: grayscale(100%);}
.contrast {-webkit-filter: contrast(160%); filter: contrast(160%);}
.brightness {-webkit-filter: brightness(0.25); filter: brightness(0.25);}
.blur {-webkit-filter: blur(3px); filter: blur(3px);}
.invert {-webkit-filter: invert(100%); filter: invert(100%);}
.sepia {-webkit-filter: sepia(100%); filter: sepia(100%);}
.huerotate {-webkit-filter: hue-rotate(180deg); filter: hue-rotate(180deg);}
.rss.opacity {-webkit-filter: opacity(50%); filter: opacity(50%);}

*/

.grayscale {-webkit-filter: grayscale(100%); filter: grayscale(100%);}
.blur {-webkit-filter: blur(3px); filter: blur(3px);}

.opacity25 {-webkit-filter: opacity(25%); filter: opacity(25%);}
.opacity50 {-webkit-filter: opacity(50%); filter: opacity(50%);}
.opacity75 {-webkit-filter: opacity(75%); filter: opacity(75%);}

@media print {

/*Bootstrap @import "print"から、必要分のみ抜粋*/
	
  *,
  *::before,
  *::after {
    text-shadow: none !important;
    -webkit-box-shadow: none !important;
            box-shadow: none !important;
  }

  a:not(.btn) {
    text-decoration: underline;
  }

  abbr[title]::after {
    content: " (" attr(title) ")";
  }

  pre {
    white-space: pre-wrap !important;
  }

  pre,
  blockquote {
    /*border: 1px solid #adb5bd;*/
    page-break-inside: avoid;
  }

  thead {
    display: table-header-group;
  }

  tr,
  img {
    page-break-inside: avoid;
  }

  p,
  h2,
  h3 {
    orphans: 3;
    widows: 3;
  }

  h2,
  h3 {
    page-break-after: avoid;
  }

  @page {
    size: a3;
  }

  body {
    min-width: 992px !important;
  }

  .container {
    min-width: 992px !important;
  }

  .navbar {
    display: none;
  }

/*layout*/

#headerNavBox,
div.titleBox_h2,
.breadcrumb,
.slicknav_btn,
footer {
    display: none !important;
}

header,
h5#index,
ul.tabBox,
div.ctaBox {
	display: none !important;
}
	
div.wrapper.row {
	display: block !important;/*必須-----ここのdisplay:flexをリセットしないと印刷表示が崩れる*/
}
	
/*
asideがある場合の設定
    
aside.col-lg-3 {
display: none !important;
}

main.col-lg-9.contentsArea {=.col-12　
-webkit-box-flex: 0;
  -ms-flex: 0 0 100%;
      flex: 0 0 100%;
max-width: 100%;
}
*/
	
ul.topics li section {
	page-break-before: always;
}
	
}