@charset "utf-8";
@font-face {
        font-family: "MyYuGothicM";
        src: local("YuGothic-Medium"),
             local("YuGothic-Regular");
}
@font-face {
        font-family: "MyYuGothicM";
        font-weight: bold;
        src: local("YuGothic-Bold")
}


@media print{
    body { height:inherit; min-height:0; margin:0; padding:0;}
}
/*
緑 #9c3->#ad4
オレンジ #f18603
黄色　#ff3
グレー #f6f6f6

青系
    リンク #369 #29c #049
    フッタ#contact_block #147
    フッタ#foot_nav #134
    フッタ#footerfoot #06c
    ラベル.labels li #049
*/
/* ---------------------------------------------
 font-size 13pxBase
--------------------------------------------- */
html{ font-size:62.5%; color:#222; } /*初期値16pxの62.5%でルートが10px*/
/*body,select,input,button,textarea { 
    font-family:"游ゴシック Medium", "Yu Gothic Medium", "游ゴシック体", YuGothic, sans-serif; 
    font-weight:400;  
}*/
body { font-family: -apple-system, BlinkMacSystemFont, MyYuGothicM, "Yu Gothic", Meiryo, "Hiragino kaku Gothic ProN", sans-serif; }
.winChrome body {font-weight: 500;}
@media all and (-ms-high-contrast:none) {
    body {font-family: Meiryo, sans-serif;}
}
/*---------------------------------------------
 reset css
--------------------------------------------- */
body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,form,p,th,td { margin:0; padding:0; line-height:1.4; }
input,textarea { margin:0; font-size:100%; position:relative; }
table { border-collapse:collapse; border-spacing:0; font-size:100%; }
img { border:0; }
address,em,th { font-style:normal; font-weight:normal; }
ol,ul { list-style:none; }
th { text-align:left; }
h1,h2,h3,h4,h5,h6 { font-size:100%; font-weight:normal; }
label { cursor:pointer;}
a,
area,
area:focus,
area:active { outline:none; border:none; border:0; position:relative;}
/*---------------------------------------------
 for IE8
--------------------------------------------- 
div { position:relative;}
/* ---------------------------------------------
 tag
--------------------------------------------- */
b,strong {font-weight:bold; color:#000;}
i { font-style:italic;}
em {color:#f18603; font-weight:bold; font-style:normal;}
em a,
em a:visited {color:#f18603; font-weight:bold; font-style:normal;}
em a:hover { text-decoration:none; color:#f18603; }
sub {vertical-align:baseline;}
sup { vertical-align: super; font-size: 60%; }
p { line-height:1.5;}
img {vertical-align:middle;}
/* link */
a,a:visited { color:#049; outline:none; /* text-decoration:none; */}
a span { cursor:pointer;}
a:hover { color:#049; text-decoration:underline; }
a img { border:none; }
/*a:hover img { opacity:0.7; filter:alpha(opacity=70); -ms-filter:"alpha(opacity=70)"; }
a:hover img.over { opacity:inherit; filter:none; -ms-filter:none; }*/
/* ---------------------------------------------
 icon
--------------------------------------------- */
@font-face {
  font-family: 'FontAwesome';

  src: url('https://www.fsi.co.jp/googlecloud/fonts/fontawesome-webfont%EF%B9%96v=4.4.0.eot');
  src: url('https://www.fsi.co.jp/googlecloud/fonts/fontawesome-webfont%EF%B9%96.eot#iefix&v=4.4.0') format('embedded-opentype'), url('https://www.fsi.co.jp/googlecloud/fonts/fontawesome-webfont%EF%B9%96v=4.4.0.woff2') format('woff2'), url('https://www.fsi.co.jp/googlecloud/fonts/fontawesome-webfont%EF%B9%96v=4.4.0.woff') format('woff'), url('https://www.fsi.co.jp/googlecloud/fonts/fontawesome-webfont%EF%B9%96v=4.4.0.ttf') format('truetype'), url('https://www.fsi.co.jp/googlecloud/fonts/fontawesome-webfont%EF%B9%96v=4.4.0.svg#fontawesomeregular') format('svg');

  font-weight: normal;
  font-style: normal;
}
.icon_info:before { content:'\f06a'; font-family:'FontAwesome'; margin-right:0.4em; font-weight:normal !important;}
.icon_info:hover { text-decoration:none; opacity:0.8; font-weight:normal;}
.icon_mail:before { content:'\f003'; font-family:'FontAwesome'; margin-right:0.4em; font-weight:normal !important;}
.icon_mail:hover { text-decoration:none; opacity:0.8; font-weight:normal;}
.icon_sitemap:before { content:'\f0e8'; font-family:'FontAwesome'; margin-right:0.4em; font-weight:normal !important;}
.icon_sitemap:hover { text-decoration:none; opacity:0.8; font-weight:normal;}
.icon_global:before { content:'\f0ac'; font-family:'FontAwesome'; margin-right:0.4em; font-weight:normal !important;}
.icon_global:hover { text-decoration:none; opacity:0.8; font-weight:normal;}
.icon_home:before { content:'\e089'; font-family:'typicons'; margin-right:0.4em; font-weight:normal !important;}
.icon_home:hover { text-decoration:none; opacity:0.8; font-weight:normal;}
.icon_login:before { content:'\f090'; font-family:'FontAwesome'; margin-right:0.4em; font-weight:normal !important;}
.icon_login:hover { text-decoration:none; opacity:0.8;}
.icon_logout:before { content:'\f08b'; font-family:'FontAwesome'; margin-right:0.4em; font-weight:normal !important;}
.icon_logout:hover { text-decoration:none; opacity:0.8;}
.icon_plus:before { content:'\f055'; font-family:'FontAwesome'; margin-right:0.4em; font-weight:normal !important;}
.icon_plus:hover { text-decoration:none; opacity:0.8;}
.icon_help:before { content:'\f1cd'; font-family:'FontAwesome'; margin-right:0.4em; font-weight:normal !important;}
.icon_help:hover { text-decoration:none;}
.icon_regist:before { content:'\f044'; font-family:'FontAwesome'; margin-right:0.4em; font-weight:normal !important;}
.icon_regist:hover { text-decoration:none; opacity:0.8;}
.icon_twitter:before { content:'\f099'; font-family:'FontAwesome'; margin-right:0.4em; font-weight:normal !important; color:#55acef; }
.icon_facebook:before { content:'\f230'; font-family:'FontAwesome'; margin-right:0.4em; font-weight:normal !important; color:#3c5a99;}
.icon_caution:before { content:'\f06a'; font-family:'FontAwesome'; margin-right:0.4em; font-weight:normal !important; color:#f60;}
.icon_date:before { content:'\f073'; font-family:'FontAwesome'; margin-right:0.4em; font-weight:normal !important; }
.icon_place:before { content:'\f041'; font-family:'FontAwesome'; margin-right:0.4em; font-weight:normal !important; }
.icon_group:before { content:'\f0c0'; font-family:'FontAwesome'; margin-right:0.4em; font-weight:normal !important; }
.icon_up:before { content:'\f01b'; font-family:'FontAwesome'; margin-right:0.4em; font-weight:normal !important;}
.icon_up:hover { text-decoration:none; opacity:0.8; font-weight:normal;}
.icon_down2 { text-align:center; padding:30px 0; }

a.link { text-decoration:none; color:#222; display:inline-block; }
a.link:hover { text-decoration:underline; color:#222; }

/*a.icon_link { text-decoration:none; }
a.icon_link:hover { text-decoration:none; }
a.icon_link:hover span { text-decoration:underline; }
a.icon_link:before { content:'\f105'; font-family:'FontAwesome'; margin-right:0.4em; font-weight:normal !important; 
    text-decoration:none; color:#f18603; padding:0 2px 0 6px; font-size:1.8rem;  }*/
/*  */
.icon_link:before { content:url("https://www.fsi.co.jp/googlecloud/images/icon_link.png"); margin-right:7px; margin-left:6px; }
.icon_newwin:before { content:url("https://www.fsi.co.jp/googlecloud/images/icon_newwin.png"); margin-right:0.4em; }
.icon_pdf:before { content:url("https://www.fsi.co.jp/googlecloud/images/icon_pdf.png"); margin-right:7px; margin-left:2px; }
/*  */

.icon_play:after { content:'\f16a'; font-family:'FontAwesome'; margin-left:0.4em; font-weight:normal !important; color:#c00; }
.icon_play:hover { text-decoration:none;}

.icon_calendar:before { content:'\f073'; font-family:'FontAwesome'; margin-right:0.4em; font-weight:normal !important;}
 
.filelist li { padding-left:2rem; margin-bottom:10px;}
.filelist li a:before { content:'\f15b'; font-family:'FontAwesome'; font-size:1.2rem; margin-right:0.4em; font-weight:normal !important; text-indent:1.4em; margin-left:-1.4em;}

/* ---------------------------------------------
 js
--------------------------------------------- */
.over            {;/* rollover */}
.js_window_open-width-height {;}
.js_page_print   { cursor:pointer;}
.js_window_close {;}
.tile2,.tile3,.tile4,.tile5,.tile6 {;}
.hideattr {display:none;}
.debug .hideattr {display:inline-block; *display:inline; *zoom:1; margin-right:10px;}
.flexli { margin:0 auto; text-align:left; }
/* ---------------------------------------------
 PC/SP
--------------------------------------------- */
.hidePC { display:none !important; }
#menuSP { display:none;}
.mobile,
.tablet,
.smartphone { display:none; }
/* ---------------------------------------------
 text
--------------------------------------------- */
.fBold { font-weight:bold;}
.fNormal  { font-weight:normal; }
.fYellow { color:#FF0;}
/* ---------------------------------------------
 h*
--------------------------------------------- */
.main h2, .main h3, .main h4, .main h5, .main h6 { clear:both; }
.main div h2, .main div h3, .main div h4, .main div h5, .main div h6,
.main ul h2, .main ul h3, .main ul h4, .main ul h5, .main ul h6,
.main table h2, .main table h3, .main table h4, .main table h5, .main table h6 { clear:none; }
/* ---------------------------------------------
 hr
--------------------------------------------- */
.hr_dotted { border:none; border-bottom:1px dotted #999; }
/* ---------------------------------------------
 list
--------------------------------------------- */
/*.article ul li,*/
ul.list0 { text-align:left; }
ul.list0 li { padding:5px 0;  line-height:1.4; }

ul.list1 { margin:0 0 10px 15px; text-align:left;}
ul.list1 li { padding:10px 0; text-indent:-13px; }
ul.list1 li:before { content:'・'; font-family:'FontAwesome'; margin-right:2px; vertical-align:middle;  line-height:1.4; }

ul.check { margin:0 0 20px 15px; text-align:left;}
ul.check li { padding:5px 0; text-indent:-13px; }
/*  */
ul.check li { padding-left:30px; background:url("https://www.fsi.co.jp/googlecloud/images/icon_check.svg") 0 10px no-repeat; background-size:20px 14px; text-indent:0;  line-height:1.4; }
/*  */
/*ul.check li:before { content:'\f00c'; font-family:'FontAwesome'; margin-right:8px; font-weight:normal !important; vertical-align:middle;  }*/

ul.idt { margin-left:1.3em; }
ul.idt li { text-indent:-1.3em; text-align:left; padding:0 0 10px; background:none;  line-height:1.4; }
ul.idt li span { font-weight:bold; color:#378; margin-right:2px;}

ol { margin:0 0 10px 1.7em; list-style:decimal outside; }
ol li { padding:10px 0 10px 5px; line-height:1.4; }

ul.inlineblock li { position:relative; display:inline-block; letter-spacing:normal; margin-right:25px; }
ul.inlineblock li img { vertical-align:middle; margin:3px;}

ul li.nolistmark { background:none;}

ul#contentsbanner { z-index:20; position:relative; font-size:0; }
ul#contentsbanner:after { content:""; display:table; clear:both; }
ul#contentsbanner li { /*float:left;*/ display:inline-block; width:33%; margin:0; padding:0; letter-spacing:normal; background:#000; }
ul#contentsbanner li a { display:block; width:100%; /* height:170px; */ overflow:hidden; position:relative; background-size:cover;  }
ul#contentsbanner li a img {
    width:100%; height:auto; opacity:0.8; 
	-webkit-transform:scale(1); transform:scale(1);
	-webkit-transition:.3s ease-in-out; transition:.3s ease-in-out; }
ul#contentsbanner li a:hover img { opacity:1;
	-webkit-transform: scale(1.1);	transform: scale(1.1); }
ul#contentsbanner li a span { position:absolute; bottom:10px; left:15px; font-weight:bold; font-size:1.5rem; text-align:left; }
ul#contentsbanner li a span em { color: #ff0; font-size: 140%; padding-bottom: 8px; display: inline-block;}
ul#contentsbanner li a span.play { top: 0; bottom:0; left:0; right: 0; margin: auto; width:50px; height: 50px; 
    background: url("https://www.fsi.co.jp/googlecloud/images/icon_play.png") center center no-repeat; background-size: contain; }
ul#contentsbanner li a span.contentsbannerBadge {
    position:absolute; bottom: auto;
    top:10px;
    right:10px; left: auto;
    font-size:1.5rem;
    text-align:center;
    background-color: #ff0;
    box-shadow: 0 0 10px rgba(0,0,0,.2);
    color: #000;
    border-radius: 50%;
    padding: 15px 15px;
    line-height: 1.2;
}


/* ---------------------------------------------
 link
--------------------------------------------- */
.tel,
.tellink { cursor:default !important; color:#444 !important; text-decoration:none; }

/* ---------------------------------------------
 table
--------------------------------------------- */
th,td {text-align:inherit; text-justify:auto; }

/* グレー */
.tbl { width: 100%; border-bottom:#ccc 1px solid; border-right:#ccc 1px solid; margin:5px 0 10px; background-color:#fff; }
.tbl caption { border:1px solid #ccc; text-align:left; font-weight:bold; padding:13px 15px; background-color:#18d; color:#fff; }
.tbl th { padding:13px 15px; vertical-align:top; text-align:left; font-weight:bold; color:#444;
    background-color:#eee; border-top:1px solid #ccc; border-left:1px solid #ccc;}
.tbl td { padding:13px 15px; border-top:1px solid #ccc; border-left:1px solid #ccc; vertical-align:top; }
.tbl td.noborder {border:none;}
.tbl td span { display:inline-block; *display:inline; *zoom:1;}

/* 横線のみ */
.tbl1 { border-bottom:#111 1px solid; margin:5px 0 10px; width:100%; }
.tbl1 th { padding:13px 15px; vertical-align:top; text-align:left; font-weight:bold; border-top:1px solid #111;}
.tbl1 td { padding:13px 15px; border-top:1px solid #111; vertical-align:top; text-align:left; }

/* 線なし */
.tbl0{ border:none;}
.tbl0 th {padding:5px; border:none; font-weight:bold; vertical-align:top; background:none;}
.tbl0 th.subth { padding-left:18px; font-weight:normal;}
.tbl0 td {padding:5px; vertical-align:top; border:none; background:none; }

/* 調整 */
table tr.noborder { border:none;}
table th.noborder-bottom,
table td.noborder-bottom { border-bottom:none;}
table .blankLefttop { border-left:0; border-top:0; background:none; }

thead.inlineL th,
tr.inlineL th,
tr.inlineL td { text-align:left;}

table.inlineC th,
table.inlineC td,
thead.inlineC th,
tr.inlineC th,
tr.inlineC td { text-align:center; padding-left:3px; padding-right:3px;}

.tbl p,
.tbl ul {font-size:100%; padding-bottom:6px;}

table ul.list1 { margin-bottom:0;}

table.th10p th { width:10%;}
table.th20p th { width:20%;}
table.th30p th { width:30%;}
table.th40p th { width:40%;}
table.th50p th { width:50%;}

.th_td_w1 th { width:18%; }
.th_td_w1 td { width:32%; }

.min-w-100px th { min-width:100px; }

.timetbl .heading {
    background-color: #049;
    color: #fff;
    text-align: center;
    padding: 10px 0;
    font-weight: bold;
}
.timetbl dl {
    display: flex;
}
.timetbl dl + dl {
    border-top: 1px solid #049;
}
.timetbl dl > * {
    padding: 20px;
    box-sizing: border-box;
}
.timetbl .time {
    flex-basis: 30%;
    background-color: #dddfe8;
    font-weight: bold;
    color: #049;
}
.timetbl .body {
    flex-basis: 70%;
}
.timetbl .body .em {
    font-size: 20px;
    font-weight: bold;
}
.timetbl .body .note {
    border-top: 1px solid #dddfe8;
    padding-top: 20px;
}



/* ---------------------------------------------
 frame
--------------------------------------------- */
.box1 { background:#f6f6f6; padding:25px 25px 10px; margin:10px 0 20px; }
.box1:after { content:""; display:table; clear:both; }
    .box1wht { background:#fff; }
    .box1border { border:1px solid #ddd; background:none; }

.box1 .h3 { margin-top: 0; margin-bottom: 15px; }
.box1 ul { margin-bottom: 15px; }
.box1 ul li { line-height: 1.8; }

.box_h { background:#036; color:#fff; text-align:center; padding:15px; font-size:123.1%; }

.box_scroll { height:150px; overflow-y:scroll; border:#ddd 1px solid; padding:10px; margin:0 0 20px;  }

.dotborder { line-height:1.3; padding:10px 20px; margin:30px 0;   
    border-top:1px dotted #999; border-bottom:1px dotted #999; }
.dotborder h3 { display:inline-block; font-weight:bold; }
.dotborder span { display:inline-block;}

/* ---------------------------------------------
 FAQ
--------------------------------------------- */
ul.faqlist { border-bottom:1px solid #eee; margin:50px 0 100px;  }
ul.faqlist li { border-top:1px solid #eee; }
ul.faqlist li .faq_q { position:relative; padding:35px 80px; }
ul.faqlist li .faq_a { position:relative; padding:0 0 35px 80px; }
ul.faqlist .icon_q, 
ul.faqlist .icon_a { position:absolute; left:30px; font-size:30px; }
ul.faqlist .icon_q { top:28px; color:#f18603; }
ul.faqlist .icon_a { top:-3px; color:#aaa; }

ul.faqlist li .faq_q { cursor:pointer; color:#222; display:block; }
    ul.faqlist li .faq_q:hover { text-decoration:none; }
ul.faqlist li .faq_q p { font-size:2rem; }

ul.faqlist li .faq_a { display:none; }
/* ul.faqlist li.open .faq_a { display:block; } */

@media only screen and (max-width:767px) {
    ul.faqlist { margin:30px 0; }
    ul.faqlist li .faq_q { padding:30px 40px 30px 30px; }
    ul.faqlist li .faq_a { padding:0 0 30px 30px; }
    ul.faqlist .icon_q, 
    ul.faqlist .icon_a { left:0; font-size:2rem; font-weight:bold; }
    ul.faqlist .icon_q { top:26px; }
    ul.faqlist .icon_a { top:-2px; }
    ul.faqlist li .faq_q p { font-size:1.5rem; font-weight:bold; }
    .icon_openclose { right:10px !important;}
    .icon_openclose { width:20px; }
    .icon_openclose::before { height:20px; }

    ul#contentsbanner li { width:inherit; height:inherit; float:none; }
    ul#contentsbanner li a { width:inherit; height:inherit; }
}

/* ---------------------------------------------
 form
--------------------------------------------- */
.form input { margin-right:5px; vertical-align:middle;}
.form input:focus { outline:none;}
.form label  { vertical-align:middle; line-height:1.4; margin:0 5px; }
.form select {padding:5px 4px 7px; border:1px solid #ddd; background:#fff; line-height:1.4; vertical-align:middle; margin:0 5px; 
	box-shadow:1px 1px 2px #eee inset; behavior:url("https://www.fsi.co.jp/PIE.htc");  outline:none;}
.form input.text,
.form textarea.text{ padding:7px 4px 5px; border:1px solid #ddd; background:#fff; line-height:1.4; vertical-align:middle; margin:0 5px; 
	box-shadow:1px 1px 2px #eee inset; behavior:url("https://www.fsi.co.jp/PIE.htc"); margin-bottom:3px; }
.inputtext { padding:9px 4px 11px; border:0; background:#fff; vertical-align:middle; margin-bottom:3px; /padding:11px 4px; }
.alphanumeric { ime-mode:disabled;}

.btn1,
.btn1:visited { text-align:center; color:#fff; text-decoration:none; font-weight:bold;  line-height:1.2; 
    padding:15px 50px 15px 30px; position:relative; min-width:100px; max-width:100%;  
	display:inline-block; outline:none; border:0; border-radius:50px; cursor:pointer; 
    background:#9c3; transition: background-color .2s, border .2s; box-sizing: border-box; }
	.btn1:hover { text-decoration:none; color:#fff; background-color:#ad4; }
	.btn1::after { content:'\f105';/*\f054*/ font-family:'FontAwesome'; font-size:25px; height:30px; font-weight:normal; 
        position:absolute; top:0; bottom:0; right:25px; margin:auto;
        transition: right 0.3s ease; -webkit-transition: right 0.3s ease;}
        .btn1:hover::after { right:15px; }

.btn1disable,
.btn1disable:hover { border:0; color:#ddd; background:#fff; cursor:default; }

.btn1mid { padding-left:0; padding-right:0; width:250px; }

.btn1f20,
.btn1f20:visited { font-size:2rem; padding:30px 70px 30px 60px; }
    .btn1f20::after { font-size:30px; height:40px; right:30px; }
        .btn1f20:hover::after { right:25px; }

.btn1clrwht,
.btn1clrwht:visited { background:none; border:1px solid #999; color:#222; }
.btn1clrwht::after { color:#f18603; }
    .btn1clrwht:hover { background:rgba(255,255,255,0.9); color:#222; border:1px solid #fff; }

.btn1clrwht2:hover { color:#999; border:1px solid #999; }

.btn1clr,
.btn1clr:visited { background:none; border:1px solid #fff; }
    .btn1clr:hover { background:rgba(255,255,255,0.2); }

.btn1wht,
.btn1wht:visited { color:#222; background:#fff; }
.btn1wht::after { color:#f18603; }
    .btn1wht:hover { background:rgba(255,255,255,0.9); color:#222; }

.btn1wht2,
.btn1wht2:visited { color:#222; background:#fff; border:1px solid #fff; }
.btn1wht2::after { color:#f18603; }
    .btn1wht2:hover { color:#666; background:#fff; border:1px solid #999; }

/*  */
.btn1newwin::after { content:url("https://www.fsi.co.jp/googlecloud/images/icon_newwin.png"); }
.btn1pdf::after { content:url("https://www.fsi.co.jp/googlecloud/images/icon_pdf.png"); }
/*  */

.btn1contact { padding:15px 24px; }
.btn1contact::before { display: none; content:'\f003'; font-size:16px; font-family:'FontAwesome'; height:20px; font-weight:normal; margin-right:10px; }
.btn1contact::after { content:''; }

.btn1gry,
.btn1gry:visited { padding:13px 24px; background:none; border:1px solid #999; color:#222; }
.btn1gry:hover { background: #eee; border-color: #eee; color: #222; }
.btn1gry::after { content:''; }



.btnarea { text-align:center; margin:60px 0 30px; line-height:0; }
.btnarea input,
.btnarea button,
.btnarea a { margin:10px 15px; cursor:pointer; display:inline-block; *display:inline; *zoom:1; vertical-align:middle; }

.require { background:#c05; color:#fff; font-size:1.1rem; font-weight:normal; padding:2px 4px; display:inline-block; *display:inline; *zoom:1; line-height:1.2; margin-left:5px;  }

/* #main .form table th { width:25%;} */
#main .form table .errmsg { color:#c05; margin:5px 0 0 5px; padding:0; 	}
#main .form table p { margin:0 5px; padding:0; line-height:1.2; }
.form input.err { background:#fee;}

/* ---------------------------------------------
  横並びグリッド
--------------------------------------------- */
/* レイアウト:横2つ  */
.cols2 { margin-right:-30px;}
	.cols2:after { content:""; display:table; clear:both; }
.cols2 .col { width:50%; float:left; padding: 30px 30px 0 0; box-sizing: border-box; }

/* レイアウト:横3つ  */
.cols3 { margin-right:-30px; margin-top: -20px;}
	.cols3:after { content:""; display:table; clear:both; }
.cols3 .col { width:33.3%; float:left; padding: 30px 30px 0 0; box-sizing: border-box;}
.cols3 .colspan2 { width:66.6%;}

/* レイアウト:横4つ  */
.cols4 { margin-right:-20px;}
	.cols4:after { content:""; display:table; clear:both; }
.cols4 .col { width:25%; *width:24.95%; float:left;}
.cols4 .colspan2 { width:50%;}
.cols4 .col .colinner { margin:0 20px 20px 0; display:block; }

/* .colinner */
.colinner  { display:block; }
	.colinner:after { content:""; display:table; clear:both; }
	.colinner  { /zoom:1; }
.colinner img { max-width:100%; }

@media only screen and (max-width:1080px) {
    .cols3 { margin-right:-15px; }
    .cols3 .col { padding-right:15px; padding-top:15px; }
}
@media only screen and (max-width:767px) {
	.cols2,
	.cols3 { margin-left:auto; margin-right:auto; }
	.cols2 .col,
	.cols3 .col { float:none; width:100%; margin:0 auto 10px; padding:0; }
	.cols4 { margin-right:5px; }
	.cols4 .col { width:50%; }
}

/* ---------------------------------------------
  縦並び
--------------------------------------------- */
.rows, .row {
	width: 100%;
}
.rows .row .colinner {
	display: flex;
	transition: all .2s ease;
}
.rows .row .colinner:hover {
	box-shadow: 0 0 30px rgba(0,0,0,.15);
}
.rows .row .colinner > .img {
	flex-basis: 36%;
	background: #fff no-repeat center / contain;
}
.rows .row .colinner > .img img {
    padding: 30px;
    box-sizing: border-box;
    background-color: #fff;
}
.rows .row .colinner > .txt {
	flex-basis: 70%;
	padding: 40px;
    color: #000;
	background-color: #f7f7f7;
	text-align: left;
}
.rows .row .colinner > .txt h3 {
	font-size: 2rem;
	font-weight: bold;
}
.rows .row .colinner > .txt * + * {
	margin-top: 10px;
}
.rows .row .colinner > .txt .btnarea {
    margin-top: 20px;
    margin-bottom: 0;
    text-align: left;
}
.rows .row .colinner > .txt .btnarea .btn1 {
    margin-left: -5px;
}
.rows .row + .row {
    margin-top: 20px;
}

@media only screen and (max-width:767px) {
	.rows .row {
		margin-bottom: 20px;
	}
	.rows .row .colinner {
		display: block;
	}
	.rows .row .colinner > .img {
		height: 160px;
	}
	.rows .row .colinner > .txt {
		padding: 15px;
	}
	.rows .row .colinner > .txt h3 {
		font-size: 1.4rem;
	}
	.rows .row .colinner > .txt p {
		font-size: 1.2rem;
	}
}

/* ---------------------------------------------
 clearfix
--------------------------------------------- */
.clearfix:after {  content:""; display:table; clear:both; }
.clearfix { /zoom:1; }

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

　#wrapper / リキッドレイアウト

============================================ */
body { text-align:center; position:relative; font-size:15px; font-size:2.3rem; }
html,body,#wrapper { ;}
#wrapper { margin:0 auto; min-width:1360px; background-color: #fff; position: relative; z-index: 2; }
	#wrapper:after { content:""; display:table; clear:both; }
	#wrapper { /zoom:1; }

#main { /* padding-bottom:60px */; }
	#main:after { content:""; display:table; clear:both; }
	#main { /zoom:1; }
/*  */
    .maininner { position:relative; text-align: left; padding:0 10px 90px; }
/*  */
    .maininner img { max-width:100%; }

.contents { /; }
/*  */
.contentsinner { max-width:1180px; margin:0 auto; overflow:hidden; }
/*  */
    .contentsinner:after { content:""; display:table; clear:both; }

/* #mainを.contents内にいれれば2カラムになる */
.contents #main { float:left; width:100%; margin-right:-270px; padding-bottom:0; }
    .contents #main .maininner { margin-right:270px; }
.contents #side { float:right; width:240px; text-align:center; margin-top:80px; }

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

　#header

============================================ */
/*  */
#header { position: fixed; top: 0; left: 0; width: 100%; z-index: 999; background-color: #fff; box-sizing: border-box; padding:20px 20px 0; min-width:1360px; border-top:3px solid #049; }
/*  */
	#header:after { content:""; display:table; clear:both; }
	#header { /zoom:1; }
#header a,
#header a:hover { text-decoration:none; }

#logo { display:block; width:150px; margin-bottom:10px; }
#logo img { max-width:100%; }
#sitetitle { float:left; text-align:left; font-size:2.5rem; color:#000; font-weight:bold; margin:10px 0 15px; }
#sitetitle:hover img { opacity:1;}

#header .btns { position:absolute; top:15px; right:20px; }
#header .btn_search,
#header .btn_global { float:right; width:40px; margin-left:10px; }
#header .btn_search img,
#header .btn_global img { max-width:100%; }
#header .btn_search a:hover img,
#header .btn_global a:hover img { opacity:0.7; }

#header .btn_contact { position:absolute; right:20px; bottom:10px;
    /* float:right; margin:0 0 0 20px; */ }

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

　#gnavi

============================================ */
/*  */
#gnavi { float:right; text-align:right; margin:0 180px -1px 0; }
/*  */
#gnavi li { display:inline-block; *display:inline; *zoom:1; padding:0 15px; }
#gnavi li a { display:block; padding:15px 0 25px; color:#222; position:relative; /*border-bottom:6px solid #fff;*/ }
#gnavi li a:after {
    content: ""; display: block; 
    width:0; height: 6px; background-color: #f18603; transition: width .2s ease-out; 
    position: absolute; left: 0; right:0; bottom: 0; margin: auto;}

#gnavi li a:hover:after,
body.page_about #gnavi li.gn_about a:after,
body.page_service #gnavi li.gn_service a:after,
body.page_conservative #gnavi li.gn_conservative a:after,
body.page_case #gnavi li.gn_case a:after,
body.page_faq #gnavi li.gn_faq a:after,
body.page_dl #gnavi li.gn_dl a:after,
body.page_event #gnavi li.gn_event a:after
	{ text-decoration:none; width: 100%; /* border-bottom:6px solid #f18603; */ }

/* ============================================
　#footer

============================================ */
/* #contact_block */
#contact_block { background:#147 url("https://www.fsi.co.jp/googlecloud/images/bg_topmainv.jpg") center center no-repeat; background-size: cover; position: relative; }
#contact_block:after { content: ""; background: #147; display: block; position: absolute; top: 0; left: 0; width: 100%; height: 100%; opacity: .5; z-index: 1; }
#contact_block h2 { font-size: 3.2rem; font-weight: bold; margin-bottom:30px; color: #fff; }
#contact_block h2 + p { font-size: 1.4rem; margin-bottom:60px; color: #fff; }
#contact_block .contentsinner { max-width:1360px; padding:80px 0; display: flex; position: relative; z-index: 2; }
#contact_block .btn1 { float: left; vertical-align: middle; }
#contact_block .freedial { float: right; vertical-align: middle; margin-left: 60px; font-size:1.6rem; background-size:50px auto; background-position:0 7px; padding-left:65px; }
#contact_block .freedial span { font-size:4.0rem; margin-bottom:10px; }
#contact_block .contact_block_item {
    flex-basis: 100%;
    padding: 0 60px;
}
#contact_block .contact_block_item-sub {
    flex-basis: 40%;
    text-align: center;
    border-left: 1px solid rgba(255,255,255,.2);
}
#contact_block .contact_block_item-sub h2 + p {
    margin-bottom: 80px;
}
#contact_block .contact_block_item-sub .btn1 {
    float: none;
    width: 100%;
}

/* #foot_nav */
#foot_nav { background: #134; color: #fff; text-align: left; position: relative; }
#foot_nav a,
#foot_nav a:visited { text-decoration: none; color: #fff; }
#foot_nav a:hover { color: #fff; text-decoration: underline; }
#foot_nav .contentsinner { width:950px; padding:60px 0; }
#foot_nav p.note { font-size:1.2rem; margin-bottom:30px;}
#foot_nav .partnerbanner { float:left; width:160px; margin-top:10px;  }
#foot_nav .sitemap { float:left; width:330px; margin:0 0 0 60px; }
#foot_nav .sitemap .footlink { display: block; padding:5px; font-weight: bold; }
#foot_nav .sitemap .footlink_sub { font-size: 1.3rem; margin-left:20px; font-weight: normal; }
#foot_nav .sitemap .btn1contact { width:240px; margin:40px 0 20px; }
#foot_nav .sitemap .btn1contact:hover { text-decoration:none; }

/* #footerbottom */
#footerbottom { background:#000; height:30px; position: relative; }
    #footerbottom:after { content:""; display:table; clear:both; }
#footerbottom .bg { float: left; width: 50%; height:100%; background: #049; }

/* #linkPagetop */
#linkPagetop { position: absolute; top:-30px; left: 0; right: 0; margin: auto; }
#linkPagetop a { display:inline-block; padding:6px 15px 14px; color:#06c; font-size:3rem; font-weight: bold; background:#eee; 
    border-radius: 30px; border:4px solid #fff; font-family:'FontAwesome'; line-height: 1; z-index: 99; text-decoration:none; }
#linkPagetop a:hover { color:#06c; text-decoration:none; background:#f9f9f9; }

/* #footerfoot */
/*  */
#footerfoot { position:relative; background:url("https://www.fsi.co.jp/googlecloud/images/bg_footer.png"); box-shadow:0 2px 2px 0 rgba(0,0,0,0.4) inset; }
/*  */
#footerfoot .contentsinner { padding:90px 0; position:relative;}
#footerfoot .footerfootlinks { float:left; width:330px; text-align: left;}
#footerfoot .footerfootlinks a { display:block; padding:5px; margin-bottom:5px; color:#06c; text-decoration: none;}
#footerfoot .footerfootlinks a:hover { text-decoration:underline;}
#footerfoot .funtoshare { float: right; display:block; width:67px; }
#footerfoot .funtoshare img { display:block; width:67px; height: auto; }
#footerfoot #copyright { color:#aaa; position:absolute; bottom:60px; right: 0; text-align: right; font-size: 1.2rem; font-family: 'arial'; }
#footerfoot #copyright span { display:inline-block; margin:0 5px; }

@media only screen and (max-width:767px) {
    #linkPagetop a.pc { display:none; }
    #linkPagetop a.sp { display:inline-block; }

    #contact_block .freedial { float:none; margin-top: 30px !important; }
    #contact_block .btn1 { float:none; margin:20px 0 0; }
    #contact_block .contentsinner { padding:30px 0 30px; width:90%; display: block;}
    #contact_block .contact_block_item {
        padding: 0 10px;
    }
    #contact_block .contact_block_item-sub {
        margin-top: 30px;
        border-left: none;
        border-top: 1px solid rgba(255,255,255,.2);
        padding-top: 30px;
    }
    #contact_block .contact_block_item-sub h2 + p {
        margin-bottom: 20px;
    }
    #contact_block h2 {
        font-size: 2.4rem;
        margin-bottom: 20px;
    }
    #contact_block h2 + p {
        margin-bottom: 20px;
    }

    #foot_nav .contentsinner { padding:30px 0 50px; width:90%; }
    #foot_nav .sitemap { width:100%; float:none; margin:0 auto; }
    #foot_nav .sitemap .btn1contact { max-width:100%; }
    #foot_nav .partnerbanner { width:inherit; float:none;}
    #foot_nav .sitemap .btn1contact { width: inherit; margin:30px 0; padding-left:0; padding-right:0; }
    #footerfoot .contentsinner { padding:30px 0 20px; }
    #footerfoot .footerfootlinks { width:50%; padding-bottom:10px;  }
    #footerfoot .footerfootlinks a { border-bottom: 1px solid #ccc; display:block; height:30px; padding:20px 0; margin:0 10px;  }
    #footerfoot .funtoshare { float: none; margin: 10px auto ;}
    #footerfoot #copyright { text-align: center; float: none; position: relative; bottom:inherit; right:inherit; font-size:1rem; }    
}

/* ============================================
　Layout
============================================ */
.mt { margin-top:30px !important; }
.mb { margin-bottom:30px !important; }
.m0 { margin:0 !important; }
/* width % */ 
.w05p { width:5%;} .w06p { width:6%;} .w07p { width:7%;} .w08p { width:8%;} .w09p { width:9%;} .w10p { width:10%;} .w11p { width:11%;} .w12p { width:12%;} .w13p { width:13%;} .w14p { width:14%;} .w15p { width:15%;} .w16p { width:16%;} .w17p { width:17%;} .w18p { width:18%;} .w19p { width:19%;} .w20p { width:20%;} .w25p { width:25%;} .w30p { width:30%;} .w33p { width:33%;} .w40p { width:40%;} .w50p { width:50%;} .w60p { width:60%;} .w70p { width:70%;} .w80p { width:80%;} .w90p { width:90%;} .w100p { width:100%;}
/* align */ 
.inlineL { text-align:left; } .inlineC { text-align:center; } .inlineR { text-align:right; } .vlineT { vertical-align:top    !important; } .vlineM { vertical-align:middle !important; } .vlineB { vertical-align:bottom !important; }
/* .clear */ 
br.clear { clear:both; height:0; font-size:0; line-height:0; }

.mb15 {
  margin-bottom: 15px !important;
}
.mb30 {
  margin-bottom: 30px !important;
}
.mb60 {
  margin-bottom: 60px !important;
}
.mb90 {
  margin-bottom: 90px !important;
}
@media only screen and (max-width: 767px) {
  .mb15 {
    margin-bottom: 10px !important;
  }
  .mb30 {
    margin-bottom: 20px !important;
  }
  .mb60 {
    margin-bottom: 30px !important;
  }
  .mb90 {
    margin-bottom: 45px !important;
  }
}


/* ============================================
　responsive layout
============================================ */
.hidePC { display:none !important; }
#gnavibtn,
#menuBtn,
#gnavi .btn1,
#linkPagetop a.sp { display:none; }

@media only screen and (max-width:1080px) {
    .contentset1 .col h3 { margin:15px 0 5px; }
    .contentset1 .col .txt { padding:1px 20px 20px; }
}
/* for SmartPhone */
@media only screen and (max-width:767px) {
	body {-webkit-text-size-adjust:100%; font-size:1.4rem; max-width: 100%; }

	.hidePC { display:inherit !important; }
	.hideSP { display:none !important; }

	html { padding:0; margin:0;}
	body { padding:0; margin:0; width:100%;}
/*    
	div,img,iframe { max-width:100%; height:auto;}
	.bx-wrapper,.bx-wrapper div,.bx-wrapper iframe { max-width:inherit; }
*/    
	#header { width:inherit; min-width:0;}
	#header div,
	#footer div,
    iframe { max-width:100%; }
	img { max-width:100%; height:auto; }
    
	ul,dl,dd,dt { margin:0; padding:0;}

	#wrapper { padding:97px 0 0; margin:0 auto; min-width:inherit;  }
 	#main { max-width:100%; width:inherit; margin:0 auto; padding-bottom:0px; }
	body.page #main,
	#content { float:none; margin:0 auto; }
	.contentsinner { max-width:100%; margin:0 auto; }
	#main .contents,
	.contents #main,
	.contents #side, aside { width:100%; float:none; margin:20px auto 0; }
    .maininner,
/*  */
    .contents #main .maininner { margin-right:auto; padding:0 0 40px; }
/*  */

	/* common */
    h2 br { display:none; }
	.h2 { margin:30px 0 20px; font-size:2rem; } 
    .h2 .en { font-size:4rem;}
    .h3 { font-size:1.8rem; margin:30px 0 10px; }
    .h4 { font-size:1.5rem; margin:30px 0 10px; }

	/* table */
	.tbl th,
	.tbl td { padding:5px; }
	td a {word-break:break-all;}
	
	.spTbl tr,
	.spTbl th,
	.spTbl td { display:block; }
	.spTbl td { border-top:none !important;}
	.spTbl input,
	.spTbl textarea { max-width:260px;}

	/* .spscroll table{ width:100%; } */
	.spscroll{ overflow:auto; }
	.spscroll th { white-space:nowrap; }
	.spscroll::-webkit-scrollbar{ height:5px;}
	.spscroll::-webkit-scrollbar-track{ background:#F1F1F1;}
	.spscroll::-webkit-scrollbar-thumb { background:#BCBCBC;}

	/* header */
/*  */
	#header { padding:5px 0; height:85px; text-align:left; top: auto; left: auto; width: 100%; box-sizing: content-box;}
/*  */
    #logo { margin:10px 0 0 10px; }
	#sitetitle { float:none; font-size: 1.5rem; margin:9px 0 7px 8px; display:block; }
	#headsubmenu { margin:0; width:inherit;}  
    #header .btns { top:5px; right:5px; }
    #header .btn_search, 
    #header .btn_global { margin-left:5px; }
    #header .btn_contact { bottom:5px; right:49px; }
    #header .btn_contact span { display:none; }
 	#header .btn_contact .btn1 { margin:0; min-width:0; padding:10px 12px; display: inline-block; }
 	#header .btn_contact .btn1contact::before { margin:0; display: block; }
    #header .btn_contact .btn1gry { display: none; }
    
	/* gnavi */
	#gnavi {left:0; right:0; top:90px; position:absolute; width:100%; min-width:inherit; float:none;
		margin:0; padding:0; text-align:center; background:#fff; display:none; opacity:0; /* transition:.2s;*/ }
    #gnavi ul { margin:15px;}
	#gnavi li { float:none; width:100%; display:block; padding:0; }
	#gnavi li a { padding:20px 0; font-weight:normal; text-align:left; border-top:1px solid #eee !important; position:relative; }
        #gnavi li a::before { content:'\f105'; font-family:'FontAwesome'; display:block; font-size:25px; color:#049; 
            top:15px; bottom:inherit; left:inherit; right:10px; position:absolute; }
        #gnavi li a:after { display:none; }
            
	#gnavi .btn1 { display:block; margin:10px; }
    
    #menuBtn { display:block; position:absolute; top:50px; right:5px; width:40px; padding:0; z-index:20; 
        background:#049; border-radius:25px; }
    
    /*　.tcon   */
    .tcon { transition:0.3s; height:40px; width:40px; background:transparent; outline:none;  margin:auto;
        -webkit-appearance:none; -moz-appearance:none; appearance:none; border:none; cursor:pointer; 
        display:-webkit-flex; display:-ms-flexbox; display:flex;   -webkit-justify-content:center; 
        -ms-flex-pack:center; justify-content:center; -webkit-align-items:center; -ms-flex-align:center; align-items:center;   
        -webkit-user-select:none; -moz-user-select:none; -ms-user-select:none; user-select:none; 
        -webkit-tap-highlight-color:transparent; -webkit-tap-highlight-color:transparent;  }
        .tcon > * { display:block;  }
        .tcon:hover, .tcon:focus { outline:none;  }
        .tcon::-moz-focus-inner { border:0;  }
    .tcon-menu__lines { display:inline-block; height:1px; width:20px; border-radius:2px; transition:0.3s; background:#fff; position:relative;  }
            .tcon:hover .tcon-menu__lines { background:#fff;}
            .tcon-menu__lines::before, 
            .tcon-menu__lines::after {
            display:inline-block; height:1px; border-radius:2px; transition:0.3s; 
            background:#fff; content:''; position:absolute; left:0; right:0; width:80%; margin:auto;
            -ms-transform-origin:1px center; -webkit-transform-origin:1px center; transform-origin:1px center; }
                    .tcon:hover .tcon-menu__lines::before, .tcon:hover .tcon-menu__lines::after { background:#fff; }
        .tcon-menu__lines::before { top:6px;  }
        .tcon-menu__lines::after { top:-6px;  }
        .tcon-transform .tcon-menu__lines { -ms-transform:scale3d(0.8, 0.8, 0.8); -webkit-transform:scale3d(0.8, 0.8, 0.8); transform:scale3d(0.8, 0.8, 0.8);  }
    .tcon-menu--xcross { width:auto;  }
        .tcon-menu--xcross.tcon-transform .tcon-menu__lines { background:transparent; background:transparent;  }
        .tcon-menu--xcross.tcon-transform .tcon-menu__lines::before, 
        .tcon-menu--xcross.tcon-transform .tcon-menu__lines::after { -ms-transform-origin:50% 50%; -webkit-transform-origin:50% 50%; transform-origin:50% 50%; top:0; width:21px; }
        .tcon-menu--xcross.tcon-transform .tcon-menu__lines::before { -ms-transform:rotate(45deg);  -webkit-transform:rotate3d(0, 0, 1, 45deg); transform:rotate3d(0, 0, 1, 45deg) scaleY(1.4); }
        .tcon-menu--xcross.tcon-transform .tcon-menu__lines::after { -ms-transform:rotate(-45deg); -webkit-transform:rotate3d(0, 0, 1, -45deg); transform:rotate(-45deg) scaleY(1.4); }
    .tcon-visuallyhidden { border:0; clip:rect(0 0 0 0); height:1px; margin:-1px; overflow:hidden; padding:0; position:absolute; width:1px;  }
    .tcon-visuallyhidden:active, .tcon-visuallyhidden:focus { clip:auto; height:auto; margin:0; overflow:visible; position:static; width:auto; }

    
	/* btn */
    .btn1, 
    .btn1:visited { padding-left:20px; padding-right:30px; display:block;  }
    .btn1::after { right:15px; }

    .btn1f20, 
    .btn1f20:visited { font-size: 1.6rem; padding:15px 0; display:block; }
    .btn1f20::after { font-size: 22px; height: 30px; }

    .layout1 { margin-right:0; }
    .layout1 .element { float:none; }
    .layout1 .elementinner { margin:0 0 30px 0; }
    .w38 { width:100%;}
    .w34 { width:100%;}

	/* こまごま */
    p.p { margin:20px 0; }
    
    ul.check li { background-size:15px; padding-left:25px; }

    .partnerbanner li a img { width:130px;}
    .partnerbanner li:last-child { margin-right:0; }

    #wrapper .freedial { font-size:1.7rem; background-size:50px auto; padding-left:60px; width:230px; margin:0 auto;}
    #wrapper .freedial span { font-size:3.7rem; margin-bottom:10px; }

    .box1 {padding:20px; }


    .lead1 { padding:0; margin:0 0 40px; }
    .lead1 br { display:none; }
    .lead1 .h { padding-bottom:1px; margin-bottom:20px; position:relative; }
    .lead1 .img { float:none; width:100%; margin-bottom:10px; }
    .lead1 .h p { margin-right:0; font-size:1.8rem; }


    .links_inpage li { border-right:none; margin-bottom:5px; }
    .links_inpage li a,
    .links_inpage li a:visited { padding:5px 10px; font-size: 1.8rem; display:block; }

    .h2set { padding:20px; margin:40px 0 15px; }
    .h2set .label { font-size:1.2rem;}
    .h2set h2 {font-size:1.8rem;}

    .clientprof h3 { padding:0 0 0 10px; margin:0 0 30px; font-size:1.5rem; border-left:3px solid #f18603; }
    
    .btnarea .btn1 { display:block; margin:10px auto; }

    /* width % */ 
    .w05p_sp { width:5%;} .w06p_sp { width:6%;} .w07p_sp { width:7%;} .w08p_sp { width:8%;} .w09p_sp { width:9%;} .w10p_sp { width:10%;} .w11p_sp { width:11%;} .w12p_sp { width:12%;} .w13p_sp { width:13%;} .w14p_sp { width:14%;} .w15p_sp { width:15%;} .w16p_sp { width:16%;} .w17p_sp { width:17%;} .w18p_sp { width:18%;} .w19p_sp { width:19%;} .w20p_sp { width:20%;} .w25p_sp { width:25%;} .w30p_sp { width:30%;} .w33p_sp { width:33%;} .w40p_sp { width:40%;} .w50p_sp { width:50%;} .w60p_sp { width:60%;} .w70p_sp { width:70%;} .w80p_sp { width:80%;} .w90p_sp { width:90%;} .w100p_sp { width:100%;}
    /* margin % */ 
    .mt { margin-top:15px !important; }
    .mb { margin-bottom:15px !important; }

}


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


     #information


------------------------------------------------------------------------------------------ */
#information { position:relative; }
    #information:after { content:""; display:table; clear:both; }
#information .contentsinner { z-index:10; position:relative; padding:15px 0 0; }
/*#information dl { float:left; text-align:left; width:100%; }*/
#information dl dt,
#information dl dd { display:inline-block; vertical-align:top; line-height:1.3; padding: 10px 0; }
#information dl dt { width:10%; }
#information dl dd { width:90%; }
#information dl dd a,
#information dl dd a:visited { display:inline-block; text-decoration:none; }
#information dl dd a:hover { text-decoration:underline; }


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

　モーダル

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

body.openmodal {
  overflow: hidden;
}

#bg_modal, #modal {
  display: none;
  position: fixed;
  z-index: 999;
}

#bg_modal {
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  text-align: center;
  background: rgba(0, 0, 0, 0.7);
  z-index: 1000;
}

@keyframes animation1 {
  0% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}
body.openmodal #bg_modal {
  display: block;
  animation-name: animation1;
  animation-timing-function: ease-out;
  animation-duration: .3s;
}

#modal {
  top: 50%;
  transform: translateY(-50%);
  left: 0;
  right: 0;
  margin: auto;
  background: #fff;
  width: 70vw;
  max-height: 80%;
  transition: all .3s ease-out;
}

@keyframes animation2 {
  0% {
    transform: translate(0, 100px);
    opacity: 0;
  }
  100% {
    transform: translate(0, -50%);
    opacity: 1;
  }
}
body.openmodal #modal {
  display: block;
  animation-name: animation2;
  animation-timing-function: ease-out;
  animation-duration: .3s;
}

#modal .modalinner {
  height: 100%;
}

.modalcontent {
  display: none;
  text-align: center;
  width: 100%;
  height: 100%;
  padding: 6rem 8rem;
  position: relative;
  box-sizing: border-box;
}
.modalcontent__heading {
  text-align: left;
}
.modalcontent__heading img {
  display: inline-block;
  vertical-align: middle;
  margin-right: 2rem;
}
.modalcontent__heading h2 {
  display: inline-block;
  vertical-align: sub;
}
.modalcontent .p {
  text-align: left;
}
.modalcontent .p.center {
  text-align: center;
  margin-top: 6rem;
  margin-bottom: 0;
}
.modalcontent .tag {
  text-align: left;
}
.modalcontent .tag span, .modalcontent .tag a {
  display: inline-block;
  padding: .5rem 2rem;
  margin-top: 1rem;
  background-color: #eee;
  border-radius: 3px;
  margin-right: 2rem;
  text-decoration: none;
  transition: all .3s ease-out;
  font-weight: bold;
  position: relative;
}
.modalcontent .tag a {
  padding: .5rem 3.5rem .5rem 2rem;
}
.modalcontent .tag a::after {
  content: '\f105';
  font-family: 'FontAwesome';
  font-weight: normal;
  position: absolute;
  top: .5rem;
  bottom: 0;
  right: 2rem;
  margin: auto;
  transition: all .2s ease-out;
}
.modalcontent .tag a:hover {
  background-color: #0d4e9e;
  color: #fff;
}
.modalcontent .tag a:hover::after {
  right: 1.5rem;
}
.modalcontent .tag a.external {
  padding-right: 4rem;
}
.modalcontent .tag a.external:after {
  content: '\f08e';
}
.modalcontent.modalcontent-min h2 {
  padding: 0 0 3rem 0;
}
.modalcontent.modalcontent-min * + h2 {
  padding-top: 4rem;
}

.modal_on {
  display: block;
}

.modalcontent .body {
  text-align: left;
}

#modal .btn_close {
  position: absolute;
  top: -50px;
  right: 3px;
  width: 34px;
  height: 34px;
  background: url("https://www.fsi.co.jp/googlecloud/images/icon_cross_white.png") center center no-repeat;
  background-size: contain;
  cursor: pointer;
}

.modalcontent .logo {
  position: absolute;
  top: 5rem;
  right: 6rem;
  max-width: 150px;
  max-height: 100px;
  width: auto;
  height: auto;
}
.modalcontent .icon {
  width: 60px;
  height: auto;
  float: left;
  margin-right: 20px;
  padding: 10px 0;
}
.modalcontent h2 {
  font-size: 2.5rem;
  font-weight: bold;
  color: #0d4e9e;
  text-align: left;
  padding: 20px 150px 40px 0;
}
.modalcontent h3 {
  color: #222;
  font-size: 1.8rem;
  font-weight: bold;
  padding: 15px 0px;
  margin-bottom: 10px;
  display: inline-block;
  width: 100%;
  border-bottom: solid #0d4e9e 2px;
}

/*.modalcontent h2 { padding:0 150px 50px 0; font-size:3rem; text-align:left; }
.h3label { background:#f18603; padding:3px 13px; color:#fff; font-size:1.3rem; margin-bottom:5px; display:inline-block; }*/
@media only screen and (max-width: 767px) {
  #modal {
    width: 90%;
  }
  .modalcontent {
    padding: 3rem 2rem;
  }
  .modalcontent h2 {
    padding: 10px 0 20px;
    font-size: 2rem;
    font-weight: bold;
  }
  .modalcontent .logo {
    position: relative;
    top: auto;
    right: auto;
    margin: auto;
  }
  .modalcontent .icon {
    width: 48px;
    padding: 0;
  }
  .modalcontent p.p {
    margin: 0;
  }
}


/*

20200220
*/

#header {
	padding: 0 20px;
    border-bottom: 1px solid #eee;
}
#header .btn_contact {
	right: 0;
}
header {
	display: flex;
	align-items: center;
	position: relative;
}
#logo {
	display: inline-block;
	width: 120px;
	margin-bottom: 0;
}
#sitetitle {
	float: none;
	font-size: 1.4rem;
	margin: 0 auto 0 20px;
}
#gnavi {
	float: none;
	font-size: 1.4rem;
	margin-right: 385px;
}
#gnavi li {
	padding: 0;
}
#gnavi li a {
	padding: 0 10px;
	line-height: 5;
}

@media only screen and (max-width: 767px) {
	#header {
		height: auto;
		padding: 0;
		min-width: 0;
	}
	header {
		padding: 5px 5px 5px 10px;
	}
	#logo {
		width: 80px;
		margin: 0;
	}
	#sitetitle {
		font-size: 1.2rem;
		margin-left: 10px;
	}
	#header .btn_contact, #menuBtn {
		position: relative;
		right: 0;
		top: 0;
	}
	#header .btn_contact {
		display: flex;
	}
    #header .btn_contact .btn1 {
        margin-right: 10px;
    }
	#gnavi {
		top: 50px;
	}
	#gnavi li a::before {
		top: 50%;
		line-height: 1;
		transform: translateY(-50%);
	}
}


/* FSI-Footer
------------------------------------------- */

.Page-top {
    background-color: #061b26;
}
.Page-top a {
  display: inline-block;
  padding:12px 30px 14px;
  color: #fff;
  font-size: 2.4rem;
  font-weight: bold;
  font-family:'FontAwesome';
  line-height: 1;
  text-decoration: none;
  opacity: .5;
  transition: opacity .3s ease;
  width: 50%;
}
.Page-top a:hover { opacity: 1; }

.FSI-Footer {
  width: 100%;
  min-width: 92rem;
  text-align: left;
  overflow: hidden;
  *zoom: 1;
}

.FSI-Footer a {
  color: #fff;
  text-decoration: none;
  transition: all .2s ease-out;
}

.FSI-Footer a:hover {
  opacity: .5;
  text-decoration: underline;
}

.FSI-Footer-product {
  text-align: center;
  padding: 16rem 0;
  background: url("https://www.fsi.co.jp/aws/img/platform/bg-product-01.png") no-repeat center/cover;
}
.FSI-Footer-product__name {
  font-size: 1.2rem;
  font-weight: 600;
  color: #fff;
}
.FSI-Footer-product__name img {
  width: 36rem;
  margin-top: 2.4rem;
}

.FSI-Footer-main {
  color: #fff;
  background-color: #2c3137;
  background-color: #134;
  padding: 8rem 16rem;
  box-sizing: border-box;
}

.FSI-Footer-main__inner {
  padding: 0 0 0 20rem;
  background: url("https://www.fsi.co.jp/googlecloud/images/fsi-logo-v--white.png") left top no-repeat;
  background-size: 12rem auto;
}

.FSI-Footer-main__Sitemap {
  overflow: hidden;
  *zoom: 1;
}

.FSI-Footer-main__Sitemap dt {
  font-size: 2.4rem;
  font-weight: bold;
  padding-top: 1rem;
}
.FSI-Footer-main__Sitemap dt a {
  display: inline-block;
}

.FSI-Footer-main__Sitemap--min dt {
  font-size: 1.8rem;
  font-weight: bold;
  padding-top: 1rem;
}

.FSI-Footer-main__Sitemap--min .FSI-Footer-main__Navi {
  width: 100%;
  float: none;
}

.FSI-Footer-main__Sitemap--min .FSI-Footer-main__Navi__item {
  float: left;
  margin-top: 1rem;
  margin-right: 2rem;
  font-size: 1.2rem;
  font-weight: normal;
}

.FSI-Footer-main__Sitemap + .FSI-Footer-main__Sitemap dt {
  border-top: 1px solid rgba(255, 255, 255, 0.5);
  padding-top: 4rem;
  margin-top: 4rem;
}

.FSI-Footer-main__Sitemap dd {
    display: flex;
}

.FSI-Footer-main__Navi {
  margin-top: 1rem;
  padding-right: 6rem;
}
.FSI-Footer-main__Navi__item {
  margin-top: 2rem;
  font-weight: bold;
}
.FSI-Footer-main__SubNavi__item {
  margin-top: 1rem;
  font-size: 1.4rem;
  font-weight: normal;
  text-indent: 1em;
}
.FSI-Footer-main__SubNavi__item:first-child {
  margin-top: 2rem;
}
.FSI-Footer-main__SubNavi__item a {
  color: rgba(255,255,255,.7);
}

.FSI-Footer-main__Contact {
  margin-top: 2rem;
  margin-left: auto;
}
.FSI-Footer-main__Contact .btn1 {
  width: 100%;
}
.FSI-Footer-main__Contact p + p {
  margin-top: 3rem;
}

.FSI-Footer-bottom {
  color: #959a9e;
  background-color: #20242d;
  background-color: #fff;
  padding: 3rem 16rem;
  box-sizing: border-box;
}

.FSI-Footer-bottom a {
  color: #959a9e;
}

.FSI-Footer-bottom__Navi__item {
  float: left;
  margin-right: 2rem;
  font-size: 1.2rem;
}

.FSI-Footer__right {
  float: right;
}

.FSI-Footer__left {
  float: left;
}

.FSI-Footer__note {
  display: flex;
  margin-top: 6rem;
  font-size: 1.2rem;
  color: rgba(255,255,255,.5);
}
.FSI-Footer__note__badge {
  margin-right: 1rem;
 /* float: left;
  margin-right: 6rem;*/

}

.FSI-Footer__copyright {
  font-size: 1.2rem;
  font-family: "Arial";
}

@media only screen and (max-width: 767px) {
  .FSI-Footer {
    width: 100%;
    min-width: 0;
  }
  .FSI-Footer__left, .FSI-Footer__right {
    float: none;
  }
  .FSI-Footer-main {
    padding: 3rem 0;
  }
  .FSI-Footer-main__inner {
    padding: 10rem 0 0 0;
    background-position: center top;
    background-size: 6rem auto;
  }
  .FSI-Footer-main__Sitemap a {
    width: 100%;
    display: block;
    padding: 2rem 5rem 2rem 2rem;
    border-top: 1px solid rgba(255, 255, 255, 0.15);
    box-sizing: border-box;
    position: relative;
  }
  .FSI-Footer-main__Sitemap a::after {
    font-family: 'FontAwesome';
    content: '\f105';
    font-size: 2rem;
    position: absolute;
    right: 2rem;
    opacity: .5;
  }
  .FSI-Footer-main__Sitemap dt {
    font-size: 2rem;
    padding-top: 0;
  }
  .FSI-Footer-main__Sitemap dd {
    display: block;
  }
  .FSI-Footer-main__Sitemap dd a {
  }
  .FSI-Footer-main__Sitemap ul {
    overflow: hidden;
    *zoom: 1;
  }
  .FSI-Footer-main__Sitemap--min dt {
    font-size: 1.8rem;
    padding-top: 0;
  }
  .FSI-Footer-main__Sitemap--min ul {
    border-bottom: 1px solid rgba(255, 255, 255, 0.15);
  }
  .FSI-Footer-main__Sitemap--min .FSI-Footer-main__Navi {
    width: 100%;
  }
  .FSI-Footer-main__Sitemap--min .FSI-Footer-main__Navi__item {
    margin-top: 0;
    margin-right: 0;
    width: 50%;
    font-size: 1.4rem;
  }
  .FSI-Footer-main__Sitemap--min .FSI-Footer-main__Navi__item:nth-child(2n+1) a {
    border-right: 1px solid rgba(255, 255, 255, 0.15);
  }
  .FSI-Footer-main__Sitemap--min .FSI-Footer-main__Navi a {
    line-height: 4rem;
  }
  .FSI-Footer-main__Sitemap + .FSI-Footer-main__Sitemap dt {
    border-top: none;
    padding-top: 0;
    margin-top: 0;
  }
  .FSI-Footer-main__Contact {
    margin-top: 3rem;
    padding: 0 2rem;
  }
  .FSI-Footer-main__Contact p + .freedial {
    margin-top: 2rem !important;
  }
  .FSI-Footer-main__Navi {
    width: 100%;
    margin-top: 0;
  }
  .FSI-Footer-main__Navi__item {
    margin-top: 0;
  }
  .FSI-Footer-main__SubNavi__item {
    margin-top: 0;
    font-size: 1.4rem;
    text-indent: 0;
    padding-left: 1rem;
  }
  .FSI-Footer-main__SubNavi__item:first-child {
    margin-top: 0;
  }
  .FSI-Footer-bottom {
    padding: 3rem 2rem;
  }
  .FSI-Footer-bottom__Navi {
    overflow: hidden;
    *zoom: 1;
  }
  .FSI-Footer-bottom__Navi__item {
    margin-left: 2rem;
    margin-bottom: 2rem;
    font-size: 1.2rem;
  }
  .FSI-Footer__note {
    display: block;
    margin-top: 0;
    padding: 3rem 2rem 0;
    font-size: 1.2rem;
  }
  .FSI-Footer__note__badge {
    /*float: none;*/
    width: 100%;
    margin: 0 0 3rem 0;
    text-align: center;
  }
  /*.FSI-Footer__note__badge img {
    max-width: 25%;
  }*/
  .FSI-Footer__copyright {
    margin-top: 1rem;
    text-align: center;
  }
}

#column {
    padding: 90px 0 90px;
}
#column h2 {
    font-size: 3.6rem;
    font-weight: bold;
    margin-bottom: 30px;
}
#column .contentsinner {
    overflow: visible;
}
.FSIColumns {
    display: flex;
}
.FSIColumns__item {
  width: 25%;
  padding: 0 1rem;
  display: flex;
  vertical-align: top;
  text-align: left;
  box-sizing: border-box;
}
.FSIColumns__item a {
  width: 100%;
  display: block;
  text-decoration: none;
  position: relative;
  border: 1px solid #eee;
  border-radius: 4px;
  color: #000;
  overflow: hidden;
  transition: all .3s ease;
}
.FSIColumns__item a:hover {
  box-shadow: 0 0 20px rgba(0,0,0,.2);
}
.FSIColumns__image {
  width: 100%;
  height: 16rem;
  background: #eee center center no-repeat;
  background-size: cover;
  box-sizing: border-box;
}
.FSIColumns__content {
  width: 100%;
  background-color: #fff;
  box-sizing: border-box;
  transition: all 0.3s ease-out;
}
.FSIColumns__content__inner {
  padding: 2rem;
}
.FSIColumns__title {
  font-size: 1.6rem;
  font-weight: 900;
}
.FSIColumns__date {
  margin-top: .5rem;
  font-size: 1.4rem;
  font-family: "Arial";
  color: #888;
}

.bx-wrapper {
  position: relative;
  margin-top: 3rem;
}
.bx-viewport {
    padding: 2rem 0;
}
a.bx-prev, a.bx-next {
  position: absolute;
  top: 50%;
  font-size: 2.4rem;
  font-family: "FontAwesome";
  text-decoration: none;
  transform: translateY(-50%);
  opacity: .5;
  color: #000;
}
a.bx-prev.disabled, a.bx-next.disabled {
  opacity: .1;
  cursor: default;
}
.bx-prev:hover, .bx-next:hover {
  opacity: 1;
  text-decoration: none;
}
.bx-prev {
  left: -4rem;
}
.bx-next {
  right: -4rem;
}

@media only screen and (max-width: 767px) {
    #column {
        padding: 2rem 0;
    }
    #column h2 {
        font-size: 2rem;
        margin-bottom: 20px;
    }
    .bx-wrapper {
        margin: 1rem auto 0;
        width: 85%;
    }
    .bx-prev {
        left: -3rem;
    }
    .bx-next {
        right: -3rem;
    }
}


.exclusionHeader {
    width: 100%;
    height: auto;
}
.exclusionHeader .exclusionHeaderItem {
    display: none;
    opacity: 0;
    transition: opacity .3s ease;
}
.exclusionHeader .exclusionHeaderItem.is_show {
    display: block;
    opacity: 1;
}
.exclusionHeader .exclusionHeaderItem > a {
    color: #fff;
    text-decoration: none;
}
.exclusionHeaderContent {
    width: 100%;
    margin: auto;
}
.exclusionHeaderContentInner {
    width: 1360px;
    min-width: 1360px;
    height: 80px;
    padding: 40px 0;
    margin: auto;
    text-align: left;
    transition: background-size .3s ease;
}
.exclusionHeaderContentInner * {
    transition: all .3s ease;
}
.exclusionHeaderTitle {
    font-size: 36px;
    font-weight: 800;
}
.exclusionHeader .btn1wht {
    margin-top: 20px;
}

.exclusionHeaderContent--min {
    z-index: 3;
}
.exclusionHeaderContent--min .exclusionHeaderContentInner {
    width: 100%;
    padding: 0 60px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    box-sizing: border-box;
}
.exclusionHeaderContent--min .exclusionHeaderTitle {
    font-size: 28px;
}
.exclusionHeaderContent--min .exclusionHeaderTitle br {
    display: none;
}
.exclusionHeaderContent--min .btn1wht {
    margin-top: 0;
    margin-left: 60px;
}


/* smallstatpack202003 */
#exclusionHeader-smallstatpack202003 > a {
    color: #ff0;
}
#exclusionHeader-smallstatpack202003 .exclusionHeaderContent {
    background: linear-gradient(90deg, rgba(84,195,241,1) 0%, rgba(0,124,200,1) 100%);
}
#exclusionHeader-smallstatpack202003 .exclusionHeaderTitle {
    font-style: italic;
}
#exclusionHeader-smallstatpack202003 .exclusionHeaderContentInner {
    background: url("https://www.fsi.co.jp/googlecloud/images/banner/ssp-2003/img.png") no-repeat right center / 40% auto;
}
#exclusionHeader-smallstatpack202003 .exclusionHeaderContent--min .exclusionHeaderContentInner {
    background-size: 30% auto;
}

/* DB移行202003 */
#exclusionHeader-db202003 > a {
    color: #fff;
}
#exclusionHeader-db202003 .exclusionHeaderContent {
    background: linear-gradient(90deg, rgba(0,0,0,1) 0%, rgba(0,0,0,1) 100%);
}
#exclusionHeader-db202003 .exclusionHeaderTitle {
    font-style: italic;
}
#exclusionHeader-db202003 .exclusionHeaderContentInner {
    background: url("https://www.fsi.co.jp/googlecloud/images/banner/db-2003/img.png") no-repeat right center / 50% auto;
}
#exclusionHeader-db202003 .exclusionHeaderContent--min .exclusionHeaderContentInner {
    background-size: 40% auto;
}

/* DXの秘訣202007 */
#exclusionHeader-db202007 > a {
  color: #fff;
}
#exclusionHeader-db202007 .exclusionHeaderContent {
  background: linear-gradient(90deg, rgba(0,0,0,1) 0%, rgba(0,0,0,1) 100%);
}
#exclusionHeader-db202007 .exclusionHeaderTitle {
  font-style: italic;
}
#exclusionHeader-db202007 .exclusionHeaderContentInner {
  background: url("https://www.fsi.co.jp/googlecloud/images/banner/dx-2007/img.png.jpeg") no-repeat center center / cover;
}
#exclusionHeader-db202007 .exclusionHeaderContent--min .exclusionHeaderContentInner {
  background-size: 100% auto;
}


@media only screen and (min-width:768px) and (max-width:1360px) {
    html { font-size: 50%; }
    #wrapper { min-width: 1240px; }
    #header { min-width: 1240px; }
    #header .btn_contact { bottom: 5px; }
    #gnavi { margin-right: 330px; }
    .contentsinner { max-width: 1180px; }
    #breadcrumb { padding-bottom: 60px; }
    #mainv .contentsinner { padding-bottom: 60px; }
    #contact_block .contentsinner { max-width: 1240px; }
    #contact_block .freedial { margin-left: 20px; }
    .exclusionHeaderContentInner { width: 1240px; min-width: 1240px; }
    .exclusionHeaderContent--min .exclusionHeaderTitle { font-size: 24px; }
    .FSI-Footer-main { padding: 8rem; }
}

@media only screen and (max-width:767px) {
    .exclusionHeaderContentInner { min-width: 0; padding: 20px; }
    .exclusionHeaderContent--min .exclusionHeaderContentInner { padding: 15px 10px; display: block; }
    .exclusionHeaderContent--min .exclusionHeaderTitle { font-size: 18px; }
    .exclusionHeaderTitle + p { display: none; }
}


#powerTip {
  max-width: 480px;
  padding: 20px;
  white-space: normal;
}
#powerTip p {
  text-align: left;
  word-break: break-all;
  white-space: normal;
  font-weight: bold;
}
#powerTip p + p {
  font-size: 14px;
  font-weight: normal;
  margin-top: 10px;
}


/* AWS Icons */

.icon {
  background: left center no-repeat;
}
.icon-ec2 {
  background-image: url("https://www.fsi.co.jp/googlecloud/images/icons/Icon-Amazon-EC2.svg");
}
.icon-rds {
  background-image: url("https://www.fsi.co.jp/googlecloud/images/icons/Icon-Amazon-RDS.svg");
}
.icon-aurora {
  background-image: url("https://www.fsi.co.jp/googlecloud/images/icons/Icon-Amazon-Aurora.svg");
}
.icon-dms {
  background-image: url("https://www.fsi.co.jp/googlecloud/images/icons/Icon-Amazon-DMS.svg");
}
.icon-documentdb {
  background-image: url("https://www.fsi.co.jp/googlecloud/images/icons/Icon-Amazon-DocumentDB.svg");
}
.icon-dynamodb {
  background-image: url("https://www.fsi.co.jp/googlecloud/images/icons/Icon-Amazon-DynamoDB.svg");
}
.icon-elasticache {
  background-image: url("https://www.fsi.co.jp/googlecloud/images/icons/Icon-Amazon-ElastiCache.svg");
}
.icon-neptune {
  background-image: url("https://www.fsi.co.jp/googlecloud/images/icons/Icon-Amazon-Neptune.svg");
}
.icon-qldb {
  background-image: url("https://www.fsi.co.jp/googlecloud/images/icons/Icon-Amazon-QLDB.svg");
}
.icon-redshift {
  background-image: url("https://www.fsi.co.jp/googlecloud/images/icons/Icon-Amazon-Redshift.svg");
}
.icon-timestream {
  background-image: url("https://www.fsi.co.jp/googlecloud/images/icons/Icon-Amazon-Timestream.svg");
}
.icon-keyspaces {
  background-image: url("https://www.fsi.co.jp/googlecloud/images/icons/Icon-Amazon-Managed-Apache-Service.svg");
}
.icon-lambda {
  background-image: url("https://www.fsi.co.jp/googlecloud/images/icons/Icon-AWS-Lambda.svg");
}
.icon-sagemaker {
  background-image: url("https://www.fsi.co.jp/googlecloud/images/icons/Icon-Amazon-SageMaker.svg");
}
.icon-iot {
  background-image: url("https://www.fsi.co.jp/googlecloud/images/icons/Icon-AWS-IoT-Core.svg");
}
.icon-codepipeline {
  background-image: url("https://www.fsi.co.jp/googlecloud/images/icons/Icon-AWS-CodePipeline.svg");
}
.icon-codecommit {
  background-image: url("https://www.fsi.co.jp/googlecloud/images/icons/Icon-AWS-CodeCommit.svg");
}
.icon-codebuild {
  background-image: url("https://www.fsi.co.jp/googlecloud/images/icons/Icon-AWS-CodeBuild.svg");
}
.icon-eks {
  background-image: url("https://www.fsi.co.jp/googlecloud/images/icons/Icon-Amazon-EKS.svg");
}
.icon-ecs {
  background-image: url("https://www.fsi.co.jp/googlecloud/images/icons/Icon-Amazon-ECS.svg");
}


.head_img {
  width: 200px;
  height: 200px;
  border-radius: 50%;
  overflow: hidden;
  position: relative;
  margin: -160px auto 40px;
  border: 10px solid #fff;
}

.ServiceCatList {
  margin-top: 16rem;
}
.ServiceCatList ul {
  display: flex;
  justify-content: space-between;
}
.ServiceCatList ul li {
  width: 30%;
  padding: 30px;
  border: 6px solid #eee;
  border-radius: 12px;
  box-sizing: border-box;
  border: none;
  background-color:  #fff;
  box-shadow: 0 0 20px rgba(0,0,0,.15);
}
.ServiceCatList ul li .img {
  width: 200px;
  height: 200px;
  border-radius: 50%;
  overflow: hidden;
  position: relative;
  margin: -130px auto 40px;
  border: 10px solid #f5bd7a;
}
.ServiceCatList ul li .img img {
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  margin: auto;
  width: auto;
  height: 100%;
}
.ServiceCatList ul li h3 {
  font-size: 2.4rem;
  font-weight: bold;
  color: #f98227;
}
.ServiceCatList ul li h3 + p {
  margin: 2rem 0;
  text-align: left;
}
.ServiceCatList ul li .btnarea {
  margin: 2rem 0 0;
}

.ServiceList {
  margin-top: 6rem;
}
.ServiceList ul {
  display: flex;
  justify-content: space-between;
  flex-wrap: wrap;
}
.ServiceList ul li {
  width: 48.5%;
  margin-top: 3%;
  padding: 30px;
  border-radius: 6px;
  overflow: hidden;
  box-sizing: border-box;
}
.ServiceList ul li h3 {
  font-size: 2rem;
  font-weight: bold;
  margin-top: 1rem;
}
.ServiceList ul li .btnarea {
  margin: 2rem 0 0;
}
.ServiceList ul li .btnarea a {
  background-color: #fff;
}

.ServiceList .ServiceList-child {
  flex-wrap: nowrap;
  position: relative;
  background-color: #fff;
  z-index: 2;
}
.ServiceList .ServiceList-child li {
  width: 100%;
  margin-top: 0;
}
.ServiceList .ServiceList-child li .img {
  width: 120px;
  height: 120px;
  margin: 2rem auto 3rem;
  background-color: #fff;
  border: #f18603 6px solid;
  border-radius: 50%;
}
.ServiceList .ServiceList-child li .img img {
  width: 80px;
  height: auto;
  transform: translateY(-50%);
  position: relative;
  top: 50%;
}
.ServiceList .ServiceList-child li h4 {
  font-size: 2rem;
}
.ServiceList .ServiceList-child li h4 + p {
  margin-top: 2rem;
  text-align: left;
}

.ServiceList-service {
}
.ServiceList-service ul li h3 {
  color: #fff;
  background-color: #f18603;
  display: flex;
  text-align: center;
  align-items: center;
  padding: 3rem 0 9rem;
  margin-top: 0;
  position: relative;
  z-index: 1;
}
.ServiceList-service h3 span {
  display: inline-block;
  margin: auto;
}
.ServiceList-service > ul > li {
  padding: 0;
  margin-top: 0;
  box-shadow: 0 0 20px rgba(0,0,0,.2);
}
.ServiceList-service > ul > li:first-child {
  width: 32.5%;
}
.ServiceList-service > ul > li:last-child {
  width: 64.5%;
}
.ServiceList-service .ServiceList-child li {
  margin-top: -9rem;
  padding-top: 0;
}

.ServiceList-support > ul > li h3 {
  color: #fff;
  background-color: #f18603;
  margin-top: 0;
  padding: 3rem 0 9rem;
}
.ServiceList-support > ul > li {
  margin-top: 0;
  margin-bottom: 3rem;
  padding: 0;
  box-shadow: 0 0 20px rgba(0,0,0,.2);
}
.ServiceList-support .ServiceList-child li {
  margin-top: -9rem;
  padding-top: 0;
}
.ServiceList-support .ServiceList-child li h4 + p {
  text-align: center;
}


.ServiceList-min {
  margin-top: 4rem;
}
.ServiceList-min ul li {
  display: block;
  height: 100%;
  padding: 40px 30px 30px;
  color: #000;
  box-sizing: border-box;
  transition: all .3s ease;
  background-color: #f2f2f2;
  text-align: center;
  text-decoration: none;
}
.ServiceList-min ul li .label {
  font-size: 1.2rem;
  font-weight: bold;
  background-color: #049;
  color: #fff;
  padding: .5rem 2rem;
  margin-left: -.5rem;
  margin-bottom: 1rem;
  border-radius: 1.5rem;
  display: inline-block;
}
.ServiceList-min ul li h3 {
}
.ServiceList-min ul li h3 + p {
  margin-top: 2rem;
  font-size: 1.4rem;
}
.ServiceList-min ul li .btnarea {
  display: flex;
  justify-content: center;
}
.ServiceList-min ul li .btn1 {
  font-size: 1.2rem;
  padding: 10px 50px 10px 20px;
}

.SolutionmapList {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}
.SolutionmapList li {
  font-size: 12px;
  font-weight: bold;
  border-radius: 6px;
  color: #fff;
  text-align: center;
  position: absolute;
  overflow: hidden;
  transition: all .3s ease;
}
.SolutionmapList li a {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  height: 100%;
  background-color: rgb(65, 117, 180);
  color: #fff;
  text-decoration: none;
  box-sizing: border-box;
  transition: all .3s ease;
}
.SolutionmapList li:hover {
  box-shadow: 0 0 10px rgba(0,0,0,.3);
}
.SolutionmapList li a:hover {
  background-color: #049;
}
.SolutionmapList li.l01 {
  width: 12.8%;
  height: 8.1%;
  top: 35.7%;
  left: 31.1%;
}
.SolutionmapList li.l02 {
  width: 12.8%;
  height: 8.1%;
  top: 69.6%;
  left: 31.1%;
}
.SolutionmapList li.l03 {
  width: 17.2%;
  height: 4.8%;
  top: 35.9%;
  left: 47.8%;
}
.SolutionmapList li.l04 {
  width: 17.2%;
  height: 4.8%;
  top: 70%;
  left: 47.8%;
}
.SolutionmapList li.l05 {
  width: 17.2%;
  height: 4.8%;
  top: 75.9%;
  left: 47.8%;
}
.SolutionmapList li.l06 {
  font-size: 11px;
  width: 15.8%;
  height: 3.4%;
  top: 56.5%;
  left: 48.6%;
}
.SolutionmapList li.l07 {
  font-size: 11px;
  width: 15.8%;
  height: 3.4%;
  top: 60.5%;
  left: 48.6%;
}
.SolutionmapList li.l08 {
  font-size: 11px;
  width: 15.8%;
  height: 3.4%;
  top: 30.5%;
  left: 48.6%;
}
.SolutionmapList li.l09 {
  font-size: 10px;
  width: 7.6%;
  height: 3.4%;
  top: 22.3%;
  left: 56.8%;
}
.SolutionmapList li.l10 {
  width: 4.9%;
  height: 74.5%;
  top: 17.6%;
  left: 85.5%;
  line-height: 1;
}
.SolutionmapList li.l10 a {
  padding: 30%;
}

.SolutionmapList li.l11 {
  font-size: 11px;
  width: 12.7%;
  height:11.5%;
  top: 63.6%;
  left: 15.5%;
  line-height: 1;
}
.SolutionmapList li.l11 a {
  padding: 30%;
}

.SolutionmapList li.l12 {
  width: 12.8%;
  height: 8.1%;
  top: 78.6%;
  left: 31.1%;
}

.SolutionmapList li.l13 {
  width: 17.2%;
  height: 7.2%;
  top: 81.7%;
  left: 47.8%;
}

.SolutionmapList li.l14 {
  width: 12.8%;
  height: 7.7%;
  top: 26.7%;
  left: 68.7%;
}
@media only screen and (max-width:767px) {
  .head_img {
    width: 120px;
    height: 120px;
    margin-top: -130px;
    border-width: 6px;
  }
  .head_img img {
    max-width: none;
    height: 100%;
  }
  .ServiceCatList {
    margin-top: 2rem;
  }
  .ServiceCatList ul {
    display: block;
  }
  .ServiceCatList ul li {
    width: 100%;
    padding: 0;
    margin-top: 2rem;
  }
  .ServiceCatList ul li h3 {
    font-size: 2rem;
  }
  .ServiceCatList ul li .img {
    width: 100%;
    height: 100px;
    margin: 0px 0 0 0px;
    border: none;
    border-radius: 6px;
    border-bottom-left-radius: 0;
    border-bottom-right-radius: 0;
  }
  .ServiceCatList ul li .img img {
    width: 100%;
    height: auto;
  }
  .ServiceCatList ul li > div {
    width: 100%;
    padding: 20px;
    box-sizing: border-box;
  }

  .ServiceList {
    margin-top: 2rem;
  }
  .ServiceList ul {
    display: block;
  }
  .ServiceList ul li {
    width: 100%;
  }
  .ServiceList-min ul li a {
    padding: 20px;
  }
  .ServiceList ul li h3 {
    font-size: 1.6rem;
  }
  .ServiceList-service > ul > li {
    width: 100% !important;
    margin-top: 2rem;
  }
  .ServiceList-support > ul > li {
    width: 100% !important;
    margin-top: 2rem;
  }
  .ServiceList-service > ul > li:last-child .ServiceList-child li:last-child {
    margin-top: 0;
  }
  .ServiceList .ServiceList-child {
    background-color: transparent;
    margin-top: -9rem;
  }
  .ServiceList-support .ServiceList-child li {
    margin-top: 0;
  }

  .ServiceList-min ul li {
    padding: 3rem 2rem 2rem;
  }
  .ServiceList-min ul li .btnarea {
    display: block;
  }

}