/*------------------------------
コンテンツ設定
------------------------------- */

/* コンテンツレイアウト設定
------------------------------- */
body{
background-position:center -260px;
padding:120px 0 0;
}
#header{
position:fixed;
width:100%;
top:0;
left:0;
}
.cont{
padding:100px 0 20px;
min-height:360px;
position:relative;
font-size:16px;
}
.cont_form{
padding:100px 0 20px;
min-height:360px;
position:relative;
font-size:16px;
}
.main,.CenterBox{
max-width:700px;
width:73%;
float:left;
padding:0;
margin:0;
}
.side,.RightBox{
max-width:240px;
width:25%;
float:right;
}
.RightBox.fixed{
position:fixed;
z-index:10;
top:10px;
margin:0 0 0 75%;
}
.temp_menu{
padding:0 0 0 77%;
}
.temp_menu .RightBox{
position:absolute;
}
.temp_menu .RightBox.fixed{
position:fixed;
margin:0;
}
/* タイトル
------------------------------- */
.cont h2{
position:relative;
margin:-70px 0 40px;
padding:30px 2% 0;
background:#eeeeee;
font-size:16px;
color:#333;
/*border-bottom:2px solid #5EC5EA;*/
}
.cont h2 span{
display:inline-block;
padding:0 0 0 10px;
font-size:14px;
color:#333;
}
.cont h2:before{
content:"";
display:inline-block;
border:10px solid transparent;
border-top:10px solid #5EC5EA;
border-left:10px solid #5EC5EA;
position:absolute;
top:6px;
left:6px;
}
.cont h2:after{
content:"";
display:block;
height:1px;
margin:8px 0 0;
background:#fff;
border-top:1px solid #5EC5EA;
}
.cont h3{
font-size:12px;
line-height:1.2;
padding:5px 18px 5px 24px;
margin:10px 0 5px;
-webkit-border-radius: 5px;
border-radius: 5px;
background: #e0ffff;
border:solid 1px #f0f0f0;
/*
background: -webkit-gradient(linear, left top, left bottom, from(#fff), to(#eee));
background: -moz-linear-gradient(top,  #fff,  #eee);
-pie-background:linear-gradient(top,  #fff,  #eee);
*/
position:relative;
behavior: url(/js/PIE.htc);
}
.cont h3:before {
content:"";
display:block;
background:#5EC5EA;
width:4px;
height:80%;
position:absolute;
top:10%;
left:8px;
-webkit-border-radius: 4px;
border-radius: 4px;
behavior: url(/js/PIE.htc);
}
.cont h3 a{
font-size:12px;
color:#333;
text-decoration:none;
}
.cont h3 small{
display:inline-block;
font-size:12px;
}
.CenterBox h2+div h3,.cont .ContDetail h3,.cont .temp h3{
margin:0px 0 16px;
}
.cont .CenterBox h3{
}
.cont .CenterBox h3 .date{
}
.cont .CenterBox h3 .ctgname{
}
.cont h4{
font-size:12px;
padding:6px 10px 0 10px;
margin:5px 20px 5px;
border-bottom:4px solid #5EC5EA;
}
.cont h4 small{
margin-left:10px;
display:inline-block;
font-size:12px;
}
.h_msg{
margin:0 2% 4%;
}
.CenterBox .h_msg{
margin:5px 2% 10px;
font-size:12px;
}

/* 新着・カテゴリサイドカラム
------------------------------- */
.cont .CenterBox{
}
.cont .CenterBox h2{
position:absolute;
top:30px;
left:0;
width:96%;
margin:0;
background-color:#eeeeee;
}
.cont .RightBox h2,.cont .s_menu h2{
position:relative;
top:auto;
left:auto;
margin:0;
padding:8px 10px 8px 20px;
background:#e0ffff;
font-size:14px;
color:#333;
border:none;
border-bottom:none;
}
.cont .RightBox h2 span,.cont .s_menu h2 span{
display:inline-block;
padding:0 0 0 10px;
color:#999;
font-size:10px;
}
.cont .RightBox h2:before,.cont .s_menu h2:before{
content:"";
display:inline-block;
border:none;
border-left:5px solid #5EC5EA;
height:36px;
position:absolute;
top:0;
left:5px;
}
.cont .RightBox h2:first-child{
}
.cont .RightBox ul,.cont .s_menu ul{
margin:0;
padding:0 6px;
background:#fcfcfc;
}
.cont .RightBox li,.cont .s_menu li{
padding:6px 4px;
border-bottom:1px dotted #ccc;
}
.cont .RightBox li a,.cont .s_menu li a{
display:block;
padding:6px 4px 6px 12px;
font-size:12px;
color:#333;
line-height:1.2;
text-decoration:none;
border-left:2px solid #5EC5EA;
transition:background 0.6s;
position:relative;
}
.cont .s_menu li ul{
margin:0;
padding:0;
}
.cont .s_menu li li a{
border-left:none;
}
.cont .s_menu li li a:before{
content:"";
display:inline-block;
border:2px solid transparent;
border-left:4px solid #5EC5EA;
margin:0 6px 0 0px;
vertical-align:middle;
}
.cont .s_menu li:last-child{
border:none;
}

.cont .RightBox li a:hover,.temp .side li a:hover{
color:#5EC5EA;
background:#fff;
}
.cont .RightBox li a:before{
content:"";
display:inline-block;
border:2px solid transparent;
border-left:4px solid #5EC5EA;
position:absolute;
top:50%;
left:0;
margin:-4px 0 0;
}

/* パンくず
------------------------------- */
.path{
position:absolute;
text-align:right;
right:0;
top:6px;
}
.path li{
display:inline;
padding:0 2px;
font-size:12px;
}
.path li a{
font-size:12px;
}
.path li a:after{
content:">";
color:#666;
padding:0 4px;
}


/* 記事本文
------------------------------- */

.cont .KijiArea{
margin:0 0 0 12px;
padding:0 4%;
line-height:1.4;
font-size:12px;
}

.cont .KijiArea p{
font-size:12px;
}

.cont article .KijiArea p,.cont .ContList p{
margin:5px 0 5px;
}
.cont article .KijiArea ul,.cont .ContList ul{
list-style:disc;
padding:0 0 0 2em;
}
.cont article .KijiArea ol,.cont .ContList ol{
list-style:decimal;
padding:0 0 0 2em;
}
.cont .KijiArea img{
max-width:100%;
}
.cont .KijiArea{
clear:both;
zoom:1;
}
.KijiArea:after,.KijiArea:before{content:"";display:table;}
.KijiArea:after{clear:both;}

.PageNavi{
text-align:center;
padding:20px 0 0;
clear:both;
}
p.ToDetail,.btn_detail{
text-align:right;
clear:both;
padding:3px 0 5px;
}
p.ToDetail a,.PageNavi a,.btn_detail a{
display:inline-block;
background:#5EC5EA;
padding:8px 16px;
margin:2px;
color:#fff;
text-decoration:none;
-webkit-border-radius: 4px;
border-radius: 4px;
position:relative;
behavior: url(/js/PIE.htc);
}
.PageNavi a.NaviNum{
margin:0;
}
.PageNavi b{
display:inline-block;
background:#ccc;
padding:8px 16px;
line-height:1;
color:#fff;
text-decoration:none;
-webkit-border-radius: 4px;
border-radius: 4px;
position:relative;
behavior: url(/js/PIE.htc);
}
.KijiArea img{
margin:0 1em 1em;
}
.KijiArea{
clear:both;
zoom:1;
}
.KijiArea:after,.KijiArea:before{content:"";display:table;}
.KijiArea:after{clear:both;}

.cont table{
width:100%;
max-width:100%;
margin:24px 0;
}
.cont th{
background:#efefef;
border:1px solid #ccc;
padding:6px 10px;
font-size:14px;
}
.cont td{
border:1px solid #ccc;
padding:6px 10px;
font-size:14px;
}


/* 添付ファイル画像 */

/* 画像共通 */
.KijiArea .ImageMain img{
margin:0 3px 0 0;
}
.ImageMain .i_block{
vertical-align:top;
display:inline-block;
}
.KijiArea .ImageMain span{
font-size:12px;
}
/* 画像1 */
.ImageMain1{
}
/* 画像2 */
.ImageMain2{
}

/* 文章上に写真表示 */
.ImgNone{
margin:0 auto 1em;
text-align:center;
}

/* 文章下に写真表示 */
.ImgBottom{
margin:1em auto 0;
text-align:center;
}


.ImgLeft{
/* float:left; */
margin:0 10px 10px 0;
}

.ImgRight{
float:right;
margin:0 0 10px 10px;
}

.ImgLeft2{
float:left;
margin:0 10px 10px 0;
}

.ImgRight2{
float:right;
margin:0 0 10px 10px;
}
.ImgLeft2 div,.ImgRight2 div{
margin:0 0 8px;
}
.ImgPane{
margin:0 auto 1em;
text-align:center;
}
.ImgPane2{
margin:1em auto 0;
/* text-align:center; */
}

.ImgSepa.ImageMain1{
margin:0 auto 1em;
/* text-align:center; */
}
.ImgSepa.ImageMain2{
margin:1em auto 0;
text-align:center;
}

/* 添付ファイル画像以外 */
file{
}

file2{
}

@media screen and (max-width: 740px) {
/* 画像共通 */
.KijiArea .ImageMain img{
margin:0;
}
.ImageMain .i_block{
vertical-align:top;
display:inline-block;
}
.KijiArea .ImageMain span{
font-size:8px;
margin:0 0 4px;
}

/* 画像1 */
.ImageMain1{
}
/* 画像2 */
.ImageMain2{
}

/* 文章上に写真表示 */
.ImgNone{
margin:0 auto 1em;
text-align:center;
}

/* 文章下に写真表示 */
.ImgBottom{
margin:1em auto 0;
text-align:center;
}


.ImgLeft{
width:140px;
/* float:left; */
margin:0 10px 10px 0;
}

.ImgRight{
width:140px;
float:right;
margin:0 0 10px 10px;
}

.ImgLeft2{
width:140px;
float:left;
margin:0 10px 10px 0;
}

.ImgRight2{
width:140px;
float:right;
margin:0 0 10px 10px;
}
.ImgLeft2 div,.ImgRight2 div{
margin:0 0 6px;
}

.ImgPane{
margin:0 auto 1em;
/* text-align:center; */
}
.ImgPane2{
margin:1em auto;
/* text-align:center; */
}
.ImgPane2 div{
width:46%;
/* margin:0 1%; */
}
.ImgPane img,.ImgPane2 img{
width:100%;
}


.ImgSepa.ImageMain1{
margin:0 auto 1em;
text-align:center;
}
.ImgSepa.ImageMain2{
margin:1em auto 0;
text-align:center;
}
}


/* メールフォーム設定
------------------------------- */
.formbody{
padding:10px 20px;
}
.formbody dt{
width:120px;
float:left;
}
.formbody dd{
margin:0 0 20px 140px;
border-bottom:1px dotted #ccc;
padding:0 0 20px 10px;
min-height:20px;
}
.formbody dt.formhead{
background:#e0ffff;
font-size:18px;
font-weight:bold;
border-bottom:2px solid #eee;
padding:10px 10px 10px 30px;
margin:30px -20px;
line-height:1.2;
width:auto;
float:none;
}
.formbody dt.formcomment{
width:auto;
float:none;
margin:0 0 20px 120px;
}
.formbody dd.btnSubmit,.back{
text-align:center;
border:none;
padding:20px 0;
}
.formbody input,.formbody textarea,.formbody select{
font-family:"ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro","メイリオ", "Meiryo", 
"Osaka", Verdana, "ＭＳ Ｐゴシック", "MS P Gothic", Arial, Helvetica, sans-serif;
max-width:100%;
}
.formbody input[type="submit"],.formbody input[type="button"],.back a{
display:inline-block;
padding:0.4em 1em;
cursor:pointer;
border-radius:6px;
border:none;
border:1px solid #ccc;
color:#333;
text-decoration:none;
font-size:14px;
background:#f3f3f3;
}
.formbody input[type="submit"]:hover,.formbody input[type="button"]:hover{
background:#fff;
}
.Alert{
text-align:center;
padding:20px 0;
}
.Certify{
text-align:center;
padding:20px 0;
}
.formthanks{
}

@media screen and (min-width: 960px) {
.RightBox.fixed{
margin:0 0 0 720px;
}
}

@media screen and (max-width: 740px) {
.cont{
padding:140px 0 32px;
}
.CenterBox,.main{
width:auto;
float:none;
margin:0 2%;
max-width:none;
}
.cont .RightBox{
width:auto;
float:none;
margin:0 2%;
max-width:none;
}
.cont .RightBox.fixed{
position:static;
margin:0 2%;
}
.access .cont{
position:relative;
padding-bottom:180px;
}
.access .cont .temp_menu{
padding:0;
}
.access .cont .RightBox{
position:absolute;
bottom:0;
width:96%;
}
.cont .RightBox h2:first-child{
margin:32px 0 0;
}
.cont h2{
position:relative;
margin:-100px 0 32px;
padding:32px 2% 18px;
font-size:24px;
}
.cont h2 span{
display:inline-block;
padding:0 0 0 6px;
font-size:12px;
color:#666;
}
.cont h2:before{
content:"";
display:inline-block;
border:10px solid transparent;
border-top:10px solid #5EC5EA;
border-left:10px solid #5EC5EA;
position:absolute;
top:6px;
left:6px;
}
.cont h2:after{
content:"";
display:block;
height:1px;
margin:6px 0 0;
background:#fff;
border-top:1px solid #5EC5EA;
}
.cont h3{
font-size:16px;
line-height:1.2;
position:relative;
padding:8px 12px 8px 18px;
margin:32px 0 16px;
}
.cont h3:before {
content:"";
display:block;
background:#5EC5EA;
width:4px;
position:absolute;
left:8px;
-webkit-border-radius: 4px;
border-radius: 4px;
}
.cont h3 a{
font-size:14px;
}
.h_msg{
font-size:12px;
}
.CenterBox .h_msg{
font-size:14px;
}
.cont th{
padding:6px 4px;
font-size:12px;
}
.cont td{
padding:6px 4px;
font-size:12px;
}
.formbody{
padding:6px 6px;
}
.formbody dt{
width:auto;
float:none;
padding:4px 2px;
font-size:12px;
background:#fafafa;
border-bottom:1px dotted #ccc;
margin:16px 0 6px;
}
.formbody dd{
margin:0 0 10px;
padding:0 0 10px 4px;
min-height:20px;
}
.formbody dt.formhead{
font-size:14px;
font-weight:bold;
border-bottom:2px solid #ccc;
padding:6px 4px 6px 15px;
margin:20px 0px 8px;
line-height:1.2;
}
.formbody dt.formcomment{
width:auto;
float:none;
margin:0 0 20px;
}
.formbody dd.btnSubmit,.back{
text-align:center;
border:none;
padding:20px 0;
}
.formbody input,.formbody textarea,.formbody select{
font-family:"ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro","メイリオ", "Meiryo", 
"Osaka", Verdana, "ＭＳ Ｐゴシック", "MS P Gothic", Arial, Helvetica, sans-serif;
max-width:90%;
margin:0 10% 0 0;
}

.Alert{
text-align:center;
padding:20px 0;
}
.Certify{
text-align:center;
padding:20px 0;
}
.formthanks{
}

}/* 740px */

@media screen and (max-width: 480px) {
body{
padding:72px 0 0;
}
.cont{
padding:108px 0 16px;
}
.cont h2{
padding:32px 5% 18px;
margin:-100px 0 16px;
font-size:18px;
}
.cont .CenterBox h2{
top:24px;
width:90%;
}
.cont h2:before{
border:6px solid transparent;
border-top:6px solid #5EC5EA;
border-left:6px solid #5EC5EA;
top:6px;
left:6px;
}
.cont h3{
margin:16px 0px 8px;
}
.cont h3,.cont h3 a{
font-size:12px;
}
.cont h4{
font-size:14px;
padding:4px 4px 4px 4px;
margin:16px 6px 8px;
}
.cont .KijiArea{
font-size:12px;
line-height:1.3;
padding:0 2%;
}
.path{
top:2px;
right:6px;
white-space:nowrap;
}
.path li{
font-size:10px;
letter-spacing:-0.0001em;
}
.path li a{
font-size:10px;
}
.h_msg{
font-size:10px;
letter-spacing:-0.0001em;
}
.CenterBox .h_msg{
font-size:12px;
}
.cont th{
padding:4px 2px;
font-size:10px;
letter-spacing:-0.0001em;
}
.cont td{
padding:4px 2px;
font-size:10px;
letter-spacing:-0.0001em;
}
.cont .RightBox h2,.cont .s_menu h2{
padding:8px 10px 0 20px;
font-size:16px;
}
.cont .RightBox h2 span,.cont .s_menu h2 span{
letter-spacing:-0.0001em;
}
.cont .RightBox ul,.cont .s_menu ul{
margin:0 0 16px;
padding:0 6px 12px;
}
.cont .RightBox li, .cont .s_menu li {
padding: 2px 4px;
}
.cont .RightBox h2::before, .cont .s_menu h2::before {
height:24px;
border-left:4px solid #5EC5EA;
}

}/* 480px */


/* 講座案内
------------------------------- */

@media screen and (max-width: 720px) {
.course_img{
text-align:center;
}
.course_img img{
max-width:48% !important;
height:auto !important;
margin:0 0 1%;
}
}

/* 会社案内
------------------------------- */

.tbl_company th,.tbl_company td, .tbl_company dt,.tbl_company dd,.tbl_company li{
font-size:10px;
}
.tbl_company #yakuin span{
display:inline-block;
width:100px;
font-size:10px;
}
.tbl_company dd{
margin:0 0 1em 1em;
}
.history_list{
font-size:12px;
}
.history_list:after{
content:"";
display:block;
clear:both;
}
.history_list dt{
font-size:10px;
width:100px;
float:left;
clear:both;
padding:3px;
}
.history_list dd{
font-size:12px;
border-bottom:1px dotted #ccc;
padding:3px;
}
.access_list .map{
position: relative;
width: 96%;
margin:0 2%;
padding: 75% 0 0 0;
background:#f0f0f0;
}
.access_list .map iframe {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
}
.access_list{
margin:0 0 32px;
}
.access_list .img{
border:none;
}
@media screen and (max-width: 720px) {
.tbl_company #yakuin span{
display:inline-block;
width:80px;
}
}
@media screen and (max-width: 480px) {
.tbl_company #yakuin span{
display:inline-block;
width:70px;
}
.history_list{
font-size:9px;
letter-spacing:-0.0001em;
}
.history_list dt{
width:80px;
padding:0.4em;
}
.history_list dd{
padding:0.4em;
}
.access_list table{
width:96%;
}
.access_list th{
width:40px;
paddin:2px 2px;
}
.access_list td{
paddin:2px 2px;
}
.access_list .img{
vertical-align:top;
}
.access_list .img img{
width:68px;
}
}

/* 事業紹介｜IT研修
------------------------------- */
.training_list{
padding:0 0 0 200px !important;
}
.training_list li{
list-style:none;
display:inline-block;
margin:0 8px 0 0;
}
.training_list dl{
margin:0 0 16px;
}
.training_list dt{
margin:0 0 6px;
}
.training_list dd{
display:inline-block;
margin:0 8px 0 0;
}
@media screen and (max-width: 480px) {
.it_training .ImgLeft{
width:80px;
}
.training_list{
padding:0 0 0 90px !important;
}
}

/* デジタルコンテンツ制作
------------------------------- */
.production .ContPage{
position:relative;
}
.production .ContPage .btn_detail{
position:absolute;
top:0;
right:10px;
white-space:nowrap;
margin:2px;
padding:0;
}
.images .cont .KijiArea{
padding:0;
}
.txt_movie{
margin:16px 0 8px;
text-align:center;
background:#fafafa;
}
.li_photo{
padding:20px 0px !important;
}
.li_photo li{
list-style:none !important;
width:21%;
float:left;
margin:0 2% 2%;
}
.li_photo li img{
margin:0 !important;
}
.li_web3d{
padding:20px 0px !important;
}
.li_web3d li{
list-style:none !important;
width:31%;
float:left;
margin:0 1% 2%;
text-align:center;
font-size:12px;
}
.li_web3d li img{
margin:0 0 4px !important;
}
@media screen and (max-width: 740px) {
.production .ContPage .btn_detail{
padding:8px 0 0;
}
.production .ContPage .btn_detail a {
padding:6px 12px;
}
}
@media screen and (max-width: 480px) {
.production .ContPage .btn_detail{
padding:5px;
right:4px;
}
.li_photo{
padding:8px 0px !important;
}
.li_photo li{
width:29%;
float:left;
margin:0 2% 2%;
}
.li_web3d{
padding:8px 0px !important;
}
.li_web3d li{
font-size:10px;
letter-spacing:-0.0001em;
}
}

/* サイトマップ
------------------------------- */
.sitemap_list dt{
font-size:18px;
font-weight:bold;
padding:32px 10px 6px 10px;
margin:0 0px 16px;
border-bottom:2px solid #5EC5EA;
clear:both;
}
.sitemap_list dd{
float:left;
width:46%;
margin:0 0 8px 2%;
}
.sitemap_list dd ul{
margin:8px 0;
}
.sitemap_list dd li{
margin:0 0 4px;
}
.sitemap_list dd a{
font-size:14px;
color:#555;
}
.sitemap_list dd a:hover{
text-decoration:none;
color:#5EC5EA;
}
.sitemap_list dd a:before{
content:"\f0a9";
display:inline-block;
margin:0 3px 0 0;
vertical-align:middle;
font-family:FontAwesome;
font-size:14px;
color:#5EC5EA;
transition:padding 0.3s,margin 0.3s;
}
.sitemap_list dd li a:before{
content:"\f0da";
display:inline-block;
margin:0 3px 0 8px;
vertical-align:middle;
font-family:FontAwesome;
font-size:14px;
color:#5EC5EA;
transition:padding 0.3s,margin 0.3s;
}

@media screen and (max-width: 480px) {
.sitemap_list dt{
font-size:14px;
padding:16px 4px 4px 4px;
margin:0 0 16px;
}
.sitemap_list dd{
width:92%;
margin:0 0 8px 8%;
}
.sitemap_list dd a{
font-size:12px;
}
}