@charset "utf-8";

/* font */
@font-face {
    font-family:'NotoSansCJKjp';
    font-style:normal;
    font-weight:normal;
    src: url('../font/NotoSansCJKjp-Light.eot');
    src: url('../font/NotoSansCJKjp-Light.eot?#iefix') format('embedded-opentype'),
    url('../font/NotoSansCJKjp-Light.woff') format('woff'),
    url('../font/NotoSansCJKjp-Light.otf')  format('opentype');
}
@font-face {
    font-family:'NotoSansCJKjp';
    font-style:normal;
    font-weight:bold;
    src: url('../font/NotoSansCJKjp-Bold.eot');
    src: url('../font/NotoSansCJKjp-Bold.eot?#iefix') format('embedded-opentype'),
    url('../font/NotoSansCJKjp-Bold.woff') format('woff'),
    url('../font/NotoSansCJKjp-Bold.otf')  format('opentype');
}
/* common */

body{font-size:95%;font-family:"NotoSansCJKjp","ヒラギノ角ゴ std W3","メイリオ","ＭＳ Ｐゴシック", Osaka;color:#333333;margin:0;padding:80px 0 0;text-align:center;height:100%;-webkit-text-size-adjust:none;}
@media screen and (max-width:960px){
body{padding:100px 0 0;}
}
@media screen and (max-width:420px){
body{padding:110px 0 0;}
}

@media screen and (max-width:480px){
body{font-size:80%;}
}


h1,h2,h3,h4,h5,h6,p,ol,ul,dt,dd{font-size:100%;padding:0;}

h1,h2,h3,h4,h5,h6{line-height:1.5em;margin:0 0 1em;}
h1,h2,h3,h4,h5,h6,strong{font-weight:bold;}
p,ol,ul,dt,dd{line-height:1.7em;margin:0 0 1.5em;}
table{line-height:1.7em;margin:0 0 1.5em;}

img{border:none;max-width:100%;height:auto;}
img.alignleft{margin:0 15px 15px 0;float:left;}
img.alignright{margin:0 0 15px 15px;float:right;}

/* コンテンツ向け 見出しスタイル */
h1{}
h2{}
h3{}
h4{}
h5{}
h6{}

.h2{background:url("../images/h2_bg01.png") no-repeat 0 18px;padding:0 0 0 60px;font-size:250%;font-weight:normal;letter-spacing:0.07em;}
.h2.black{background:url("../images/h2_bg02.png") no-repeat 0 18px;padding:0 0 0 60px;}
.h2 span{font-size:45%;display:inline-block;margin-left:15px;letter-spacing:0.05em;}

.h3{border:solid #333333;border-width:0 0 0 4px;font-size:160%;padding:0 0 0 20px;font-weight:normal;line-height:1em;}

@media screen and (max-width:640px){
.h2{font-size:200%;background:url("../images/h2_bg01.png") no-repeat 0 10px;}
.h2.black{background:url("../images/h2_bg02.png") no-repeat 0 10px;}
.h2 span{font-size:50%;}
}
@media screen and (max-width:540px){
.h2 span{display:block;margin:0;line-height:1em;}
}
@media screen and (max-width:480px){
.h2{background:url("../images/h2_bg01.png") no-repeat 0 10px;background-size:35px;padding:0 0 0 45px;}
.h2.black{background:url("../images/h2_bg02.png") no-repeat 0 10px;background-size:35px;padding:0 0 0 45px;}
}


/* リスト通常使用 */
ul.normal{padding-left:15px;margin-left:15px;padding-right:10px;list-style:disc;}
ul.normal li{margin-bottom:5px;}
ul.none{list-style:none;}

ol.normal{padding-left:15px;margin-left:15px;list-style:decimal;}
ol.normal li{margin-bottom:5px;}

dl{margin:0;padding:0;}
dt{margin:0;padding:0;}
dd{margin:0;padding:0;}

a:link{text-decoration:underline;color:#000000;}
a:visited{text-decoration:underline;color:#000000;}
a:hover{text-decoration:none;color:#000000;}

a:hover img{filter:alpha(opacity=70);-moz-opacity:0.70;opacity:0.70;-webkit-transition: all 0.3s ease;-moz-transition: all 0.3s ease;}

a.win{background:url("../images/ico_win.png") no-repeat 100% 50%;padding-right:35px;}

table ul,table ol{margin-bottom:0;}

table{border:solid #cccccc;border-width:1px 0 0;}
th{padding:15px 20px;font-weight:normal;border:solid #cccccc;border-width:0 0 1px;}
td{padding:15px 20px;border:solid #cccccc;border-width:0 0 1px;}

@media screen and (max-width:768px){
th,
td{padding:10px;}
}
@media screen and (max-width:480px){
th,
td{padding:5px;}
}

@media screen and (max-width:768px){
.nobr{display:none;}
}

/* input */
input,textarea{font-family:"NotoSansCJKjp","ヒラギノ角ゴ std W3","メイリオ","ＭＳ Ｐゴシック", Osaka;font-size:100%;box-sizing:border-box;}

/* */
@media screen and (max-width:640px){
#wrap{width:100%;overflow:hidden;}
}

/* メイン画像 */
#mainimg{position:relative;}
#mainimg div{display:table;position:relative;}
#mainimg div span{display:table-cell;vertical-align:middle;font-size:170%;color:#ffffff;letter-spacing:0.05em;}
#mainimg .next{position:absolute;bottom:0;width:100%;}

#mainimg #main01{width:100%;height:100%;background:url("../images/main_img01.jpg") no-repeat 50% 60%;background-size:cover;}
#mainimg #main02{width:100%;height:100%;background:url("../images/main_img02.jpg") no-repeat 50% 60%;background-size:cover;}
#mainimg #main03{width:100%;height:100%;background:url("../images/main_img03.jpg") no-repeat 50% 60%;background-size:cover;}
#mainimg #main04{width:100%;height:100%;background:url("../images/main_img04.jpg") no-repeat 50% 60%;background-size:cover;}
#mainimg #main05{width:100%;height:100%;background:url("../images/main_img05.jpg") no-repeat 50% 60%;background-size:cover;}

@media screen and (max-width:640px){

}

/* ヘッダー */
#header{width:100%;height:80px;background:url("../images/header_bg01.jpg") no-repeat 50%;background-size:cover;position:fixed;top:0;z-index:20;}

#logo{float:left;margin:23px 0 0;padding:0;font-size:140%;font-weight:normal;letter-spacing:0.1em;}
#logo a{color:#ffffff;text-decoration:none;}
@media screen and (max-width:960px){
#logo{margin:15px 0 0;}
#header{height:100px;}
}
@media screen and (max-width:640px){
#logo{margin:10px 0 0;float:none;}
}
@media screen and (max-width:480px){
#logo{text-align:center;}
}
@media screen and (max-width:420px){
#header{height:110px;}
}

#gnavi{float:left;list-style:none;margin:25px 0 0 35px;padding:0 0 0 20px;display:inline-block;}
#gnavi li{display:inline-block;vertical-align:top;margin:0 0 0 20px;height:30px;position:relative;}

#gnavi li span.bar{position:absolute;bottom:0;left:0;margin:0;width:0;height:30px;border:solid #ffffff;z-index:1;
border-width:0 0 1px;-webkit-transition: all 0.5s ease;-moz-transition: all 0.5s ease;}
#gnavi li:hover span.bar{width:100%;-webkit-transition: all 0.5s ease;-moz-transition: all 0.5s ease;}

#gnavi li a{display:inline-block;vertical-align:top;position:relative;z-index:3;color:#ffffff;text-decoration:none;
-webkit-transition: all 0.5s ease;-moz-transition: all 0.5s ease;}

/*
#gnavi li#navi01 a{width:50px;height:12px;background:url("../images/gnavi01.png") no-repeat 0 0;}
#gnavi li#navi02 a{width:51px;height:12px;background:url("../images/gnavi02.png") no-repeat 0 0;}
#gnavi li#navi03 a{width:59px;height:12px;background:url("../images/gnavi03.png") no-repeat 0 0;}
#gnavi li#navi04 a{width:39px;height:12px;background:url("../images/gnavi04.png") no-repeat 0 0;}
*/
/*
#gnavi li#navi01.current span.bar,
#gnavi li#navi02.current span.bar,
#gnavi li#navi03.current span.bar,
#gnavi li#navi04.current span.bar{width:100%;}
*/

#about #gnavi li#navi01 span.bar{width:100%;}
#works #gnavi li#navi02 span.bar{width:100%;}
#service #gnavi li#navi03 span.bar{width:100%;}
#flow #gnavi li#navi04 span.bar{width:100%;}

#contact{float:right;margin:22px 0 0 0;}
#contact a{display:inline-block;padding:7px 10px;border:solid 1px #ffffff;color:#ffffff;text-decoration:none;line-height:1em;background:url("../images/white20.png");
-webkit-transition: all 0.3s ease;-moz-transition: all 0.3s ease;}
#contact a:hover{filter:alpha(opacity=70);-moz-opacity:0.70;opacity:0.70;}

#gnavi li#navi01 a.smf{display:none;}

@media screen and (max-width:960px){
#gnavi{float:right;margin:10px 0 0 15px;}
#gnavi li{margin:0 0 0 15px;}

#contact{margin:15px 0 0 0;}
}
@media screen and (max-width:768px){
#gnavi li{margin:0 0 0 10px;}
}
@media screen and (max-width:640px){
#gnavi{float:left;margin:10px 0 0 0;padding:0;}

#gnavi li:hover span.bar{width:0;}
#gnavi li#navi01.current span.bar,
#gnavi li#navi02.current span.bar,
#gnavi li#navi03.current span.bar,
#gnavi li#navi04.current span.bar,
#gnavi li#navi05.current span.bar{width:0;}

#gnavi li#navi01 a.pc{display:none;}
#gnavi li#navi01 a.smf{display:block;}

#gnavi li:first-child{margin:0;}

#contact{margin:10px 0 0 15px;}
#contact a{padding:5px;}
}
@media screen and (max-width:540px){
#contact a{font-size:90%;}
#contact{margin:10px 0 0 5px;}
}
@media screen and (max-width:420px){
#gnavi{float:none;margin:10px auto 0;text-align:center;display:block;}
#gnavi li{height:auto;}
#gnavi li a{display:inline;}
#contact{float:none;margin:10px 0 0;text-align:center;}
}

@media only screen and (-webkit-min-device-pixel-ratio: 1.5) {	

}



/* フッター */
#footer{background:#f6f6f6;text-align:center;padding:40px 0;margin:60px auto 0;}

#f_left{float:left;width:400px;}
#f_right{float:right;width:500px;text-align:right;}

#f_menu{list-style:none;line-height:1em;margin:0 0 25px;}
#f_menu li{display:inline-block;padding:0 9px 0 7px;border:solid #333333;border-width:0 1px 0 0;}
#f_menu li.last{border:none;padding:0 0 0 7px;}
#f_menu a{color:#333333;}

#f_menu2{}
#f_menu2 li{display:inline-block;margin:0 0 0 15px;vertical-align:middle;}

#f_menu2 li#f_contact{position:relative;top:-2px;}
#f_menu2 li#f_contact a{display:inline-block;padding:7px 10px;border:solid 1px #333333;color:#333333;text-decoration:none;line-height:1em;background:#ffffff;
-webkit-transition: all 0.3s ease;-moz-transition: all 0.3s ease;}
#f_menu2 li#f_contact a:hover{filter:alpha(opacity=70);-moz-opacity:0.70;opacity:0.70;}

#copy{font-size:13px;}

@media screen and (max-width:960px){
#f_left{width:48%;}
#f_right{width:48%;}

#f_menu{display:none;}
}

@media screen and (max-width:640px){
#footer{padding:40px 4%;}
#footer .inner{width:100%;}

#f_left{width:100%;float:none;text-align:center;}
#f_right{width:100%;float:none;text-align:center;}

#f_menu2 li#f_contact a{padding:5px;}

.foot_none{display:none;}
.foot_block{display:block;}
}
@media screen and (max-width:540px){
#f_menu2 li#f_contact a{font-size:90%;}
}

/* gotop */
#topcontrol{z-index:20;}
#topcontrol img{width:78px !important;height:48px !important;}
#topcontrol img:hover{filter:alpha(opacity=70);-moz-opacity:0.70;opacity:0.70;-webkit-transition: all 0.3s ease;-moz-transition: all 0.3s ease;}

@media screen and (max-width:640px){
#topcontrol img{width:50px !important;height:31px !important;filter:alpha(opacity=60);-moz-opacity:0.60;opacity:0.60;}
}


/* コンテンツ */
#cont{padding:60px 0 0;}

.inner{width:940px;margin:0 auto;text-align:left;position:relative;}
@media screen and (max-width:960px){
.inner{width:760px;margin:0 auto;text-align:left;}
}
@media screen and (max-width:768px){
.inner{width:640px;margin:0 auto;text-align:left;}

#cont{padding:30px 0 0;}
}
@media screen and (max-width:640px){
.inner{width:92%;margin:0 auto;text-align:left;}
}
@media screen and (max-width:480px){
.inner{width:92%;margin:0 auto;text-align:left;}
}

.inner_clm{width:940px;margin:0 auto;text-align:left;}
@media screen and (max-width:960px){
.inner_clm{width:760px;margin:0 auto;text-align:left;}
}
@media screen and (max-width:768px){
.inner_clm{width:640px;margin:0 auto;text-align:left;}
}
@media screen and (max-width:640px){
.inner_clm{width:92%;margin:0 auto;text-align:left;}
}
@media screen and (max-width:480px){
.inner_clm{width:92%;margin:0 auto;text-align:left;}
}
@media screen and (max-width:320px){
.inner_clm{width:100%;margin:0 auto;text-align:left;}
}

.inner_clm ul{list-style:none;margin:0;padding:0;font-size:0;}
.inner_clm ul li{float:left;position:relative;width:300px;margin:0 20px 40px 0;padding:0;text-align:center;}
.inner_clm ul li:nth-child(3n){float:right;margin:0 0 40px;}

.inner_clm ul li a{display:block;}

.inner_clm ul li p{margin:0 0 10px;text-align:center;font-size:18px;padding:0;}

.inner_clm ul li .imgbox{overflow:hidden;position:relative;height:200px;margin:0 0 10px;}
.inner_clm ul li .mask1,
.inner_clm ul li .mask2{background:#1a4a72;background:rgba(26,74,114,0.6);}
.inner_clm ul li .title{display:table;vertical-align:middle;position:absolute;top:0;text-align:center;width:100%;height:200px;}
.inner_clm ul li .title span{display:table-cell;vertical-align:middle;color:#ffffff;font-size:115%;background:url("../images/bg30.png");}

.inner_clm ul li .img{-webkit-transition:all 0.35s ease-in-out;-moz-transition:all 0.35s ease-in-out;transition:all 0.35s ease-in-out;}

.inner_clm ul li .mask1,
.inner_clm ul li .mask2{position:absolute;background:#333333;background:rgba(0, 0, 0, 0.6);height:361px;width:361px;
-webkit-transition:all 0.35s ease-in-out;-moz-transition:all 0.35s ease-in-out;transition:all 0.35s ease-in-out;}

.inner_clm ul li .mask1{
left:auto;right:0;top:0;
-webkit-transform:rotate(56.5deg) translateX(-180px);
-moz-transform:rotate(56.5deg) translateX(-180px);
-ms-transform:rotate(56.5deg) translateX(-180px);
-o-transform:rotate(56.5deg) translateX(-180px);
transform:rotate(56.5deg) translateX(-180px);
-webkit-transform-origin:100% 0%;
-moz-transform-origin:100% 0%;
-ms-transform-origin:100% 0%;
-o-transform-origin:100% 0%;
transform-origin:100% 0%;
}

.inner_clm ul li .mask2{
top:auto;bottom:0;left:0;
-webkit-transform:rotate(56.5deg) translateX(180px);
-moz-transform:rotate(56.5deg) translateX(180px);
-ms-transform:rotate(56.5deg) translateX(180px);
-o-transform:rotate(56.5deg) translateX(180px);
transform:rotate(56.5deg) translateX(180px);
-webkit-transform-origin:0% 100%;
-moz-transform-origin:0% 100%;
-ms-transform-origin:0% 100%;
-o-transform-origin:0% 100%;
transform-origin:0% 100%;}

.inner_clm ul li .info{
position:absolute;font-size:14px;background:#111111;color:#ffffff;height:0;visibility:hidden;width:561px;
-webkit-transform: rotate(-33.5deg) translate(-112px, 166px);
-moz-transform: rotate(-33.5deg) translate(-112px, 166px);
-ms-transform: rotate(-33.5deg) translate(-112px, 166px);
-o-transform: rotate(-33.5deg) translate(-112px, 166px);
transform: rotate(-33.5deg) translate(-112px, 166px);
-webkit-transform-origin:0% 100%;
-moz-transform-origin:0% 100%;
-ms-transform-origin:0% 100%;
-o-transform-origin:0% 100%;
transform-origin:0% 100%;
-webkit-transition:all 0.35s ease-in-out 0.35s;
-moz-transition:all 0.35s ease-in-out 0.35s;
transition:all 0.35s ease-in-out 0.35s;
}

.inner_clm ul li .info h3{text-transform:uppercase;
font-size:120%;width:250px;padding:10px 0;background:transparent;margin:5px auto;border-bottom:1px solid rgba(255, 255, 255, 0.2);opacity:0;
-webkit-transition:all 0.35s ease-in-out 0.35s;-moz-transition:all 0.35s ease-in-out 0.35s;transition:all 0.35s ease-in-out 0.35s;}
.inner_clm ul li .info p{padding:5px 20px 20px;opacity:0;font-size:100%;
-webkit-transition:all 0.35s ease-in-out 0.35s;-moz-transition:all 0.35s ease-in-out 0.35s;transition:all 0.35s ease-in-out 0.35s;}
  
.inner_clm ul li a:hover .mask1{
-webkit-transform:rotate(56.5deg) translateX(1px);
-moz-transform:rotate(56.5deg) translateX(1px);
-ms-transform:rotate(56.5deg) translateX(1px);
-o-transform:rotate(56.5deg) translateX(1px);
transform:rotate(56.5deg) translateX(1px);
}
.inner_clm ul li a:hover .mask2{
-webkit-transform:rotate(56.5deg) translateX(-0.35px);
-moz-transform:rotate(56.5deg) translateX(-0.35px);
-ms-transform:rotate(56.5deg) translateX(-0.35px);
-o-transform:rotate(56.5deg) translateX(-0.35px);
transform:rotate(56.5deg) translateX(-0.35px);
}
.inner_clm ul li a:hover .info {width:300px;height:160px;top:20px;visibility:visible;
-webkit-transform:rotate(0deg) translate(0, 0);-moz-transform:rotate(0deg) translate(0, 0);-ms-transform:rotate(0deg) translate(0, 0);-o-transform:rotate(0deg) translate(0, 0);transform:rotate(0deg) translate(0, 0);}

.inner_clm ul li a:hover .info h3,
.inner_clm ul li a:hover .info p{opacity:1;}


@media screen and (max-width:960px){
.inner_clm ul{width:640px;margin:0 auto;}
.inner_clm ul li{margin:0 0 40px;}
.inner_clm ul li:nth-child(3n){float:left;}
.inner_clm ul li:nth-child(even){float:right;}

.inner_clm ul li a:hover .mask1,
.inner_clm ul li a:hover .mask2,
.inner_clm ul li a:hover .info{display:none;}
}
@media screen and (max-width:640px){
.inner_clm ul{width:460px;text-align:left;}
.inner_clm ul li{width:220px;margin:0 5px 30px;}

.inner_clm ul li .imgbox{height:147px;}
.inner_clm ul li .title{height:147px;}

.inner_clm ul li .info h3{width:200px;padding:10px 0 5px;}
.inner_clm ul li .info{font-size:12px;}
.inner_clm ul li a:hover .info{width:220px;height:127px;top:10px;}
}
@media screen and (max-width:480px){
.inner_clm ul{width:auto;text-align:center;}
.inner_clm ul li{width:300px;float:none !important;margin:0 auto 30px !important;}

.inner_clm ul li .imgbox{height:200px;}
.inner_clm ul li .title{height:200px;}

.inner_clm ul li .info h3{width:250px;padding:10px 0;}
.inner_clm ul li .info{font-size:14px;}
.inner_clm ul li a:hover .info{width:300px;height:160px;top:20px;}
}

/*
@-moz-document url-prefix(){
.inner_clm ul li p img{position:relative;top:2px;}
}


.inner_clm ul li p.ico{position:absolute;top:-17px;left:0px;z-index:10;}
@media screen and (max-width:640px){
.inner_clm ul li p.ico{position:absolute;top:-17px;left:-3px;z-index:10;}
}
@media screen and (max-width:480px){
.inner_clm ul li p.ico{position:absolute;top:-17px;left:-10px;z-index:10;}
}


.inner_clm ul li a div.img{position:relative;line-height:0em;margin:0 0 15px;width:100%;height:100%;}

.inner_clm ul li a .info{height:200px;position:absolute;top:0;left:0;display:table-cell;vertical-align:middle;text-align:center;overflow:hidden;
background:#000000;opacity:0;-ms-filter:"alpha(opacity=0)";-webkit-transition:all 0.7s ease;transition:all 0.7s ease;}
.inner_clm ul li a .info p{width:300px;height:185px;display:table-cell;vertical-align:middle;color:#ffffff;font-size:14px;}
.inner_clm ul li a .info p span{display:block;position:relative;}
.inner_clm ul li a .info p span.info_tit{width:250px;margin:0 auto 10px;padding:0 0 10px;font-size:120%;font-weight:bold;border:solid #cccccc;border-width:0 0 1px;left:-300px;-webkit-transition:all 0.7s ease;transition:all 0.7s ease;}
.inner_clm ul li a .info p span.info_txt{left:300px;-webkit-transition:all 0.7s ease;transition:all 0.7s ease;padding:0 15px;}

.inner_clm ul li a:hover .info{opacity:0.8;-ms-filter:"alpha(opacity=80)";-webkit-transition:all 0.5s ease;transition:all 0.5s ease;}
.inner_clm ul li a:hover .info p span{left:0;-webkit-transition:all 0.7s ease;transition:all 0.7s ease;}

@media screen and (max-width:640px){
.inner_clm ul li a .info{height:147px;}
.inner_clm ul li a .info p{height:127px;font-size:12px;}
.inner_clm ul li a .info p span.info_tit{width:200px;}
}
@media screen and (max-width:480px){
.inner_clm ul li a .info{height:200px;}
.inner_clm ul li a .info p{height:185px;}
.inner_clm ul li a .info p span.info_tit{width:250px;}
}
*/

.inner_clm4{width:940px;margin:0 auto;text-align:left;}
@media screen and (max-width:960px){
.inner_clm4{width:760px;margin:0 auto;text-align:left;}
}
@media screen and (max-width:768px){
.inner_clm4{width:640px;margin:0 auto;text-align:left;}
}
@media screen and (max-width:640px){
.inner_clm4{width:92%;margin:0 auto;text-align:left;}
}
@media screen and (max-width:480px){
.inner_clm4{width:92%;margin:0 auto;text-align:left;}
}
@media screen and (max-width:320px){
.inner_clm4{width:100%;margin:0 auto;text-align:left;}
}

.inner_clm4 ul li{float:left;width:220px;padding:0;margin:0 20px 40px 0;}
.inner_clm4 ul li:nth-child(4n){float:right;margin:0 0 40px;}

.inner_clm4 ul li{text-align:center;font-size:120%;}

.inner_clm4 ul li .imgbox{overflow:hidden;position:relative;height:220px;margin:0 0 10px;}
.inner_clm4 ul li .mask1,
.inner_clm4 ul li .mask2{background:#1a4a72;background:rgba(26,74,114,0.6);}

.inner_clm4 ul li .img{-webkit-transition:all 0.35s ease-in-out;-moz-transition:all 0.35s ease-in-out;transition:all 0.35s ease-in-out;}

.inner_clm4 ul li .mask1,
.inner_clm4 ul li .mask2{position:absolute;background:#333333;background:rgba(0, 0, 0, 0.6);height:361px;width:361px;
-webkit-transition:all 0.35s ease-in-out;-moz-transition:all 0.35s ease-in-out;transition:all 0.35s ease-in-out;}

.inner_clm4 ul li .mask1{
left:auto;right:0;top:0;
-webkit-transform:rotate(56.5deg) translateX(-180px);
-moz-transform:rotate(56.5deg) translateX(-180px);
-ms-transform:rotate(56.5deg) translateX(-180px);
-o-transform:rotate(56.5deg) translateX(-180px);
transform:rotate(56.5deg) translateX(-180px);
-webkit-transform-origin:100% 0%;
-moz-transform-origin:100% 0%;
-ms-transform-origin:100% 0%;
-o-transform-origin:100% 0%;
transform-origin:100% 0%;
}

.inner_clm4 ul li .mask2{
top:auto;bottom:0;left:0;
-webkit-transform:rotate(56.5deg) translateX(180px);
-moz-transform:rotate(56.5deg) translateX(180px);
-ms-transform:rotate(56.5deg) translateX(180px);
-o-transform:rotate(56.5deg) translateX(180px);
transform:rotate(56.5deg) translateX(180px);
-webkit-transform-origin:0% 100%;
-moz-transform-origin:0% 100%;
-ms-transform-origin:0% 100%;
-o-transform-origin:0% 100%;
transform-origin:0% 100%;}

.inner_clm4 ul li .info{
position:absolute;font-size:14px;background:#111111;color:#ffffff;height:0;visibility:hidden;width:461px;
-webkit-transform: rotate(-33.5deg) translate(-112px, 166px);
-moz-transform: rotate(-33.5deg) translate(-112px, 166px);
-ms-transform: rotate(-33.5deg) translate(-112px, 166px);
-o-transform: rotate(-33.5deg) translate(-112px, 166px);
transform: rotate(-33.5deg) translate(-112px, 166px);
-webkit-transform-origin:0% 100%;
-moz-transform-origin:0% 100%;
-ms-transform-origin:0% 100%;
-o-transform-origin:0% 100%;
transform-origin:0% 100%;
-webkit-transition:all 0.35s ease-in-out 0.35s;
-moz-transition:all 0.35s ease-in-out 0.35s;
transition:all 0.35s ease-in-out 0.35s;
}

.inner_clm4 ul li .info h3{text-transform:uppercase;
font-size:120%;width:180px;padding:10px 0;background:transparent;margin:5px auto;border-bottom:1px solid rgba(255, 255, 255, 0.2);opacity:0;
-webkit-transition:all 0.35s ease-in-out 0.35s;-moz-transition:all 0.35s ease-in-out 0.35s;transition:all 0.35s ease-in-out 0.35s;}
.inner_clm4 ul li .info p{padding:5px 20px 20px;opacity:0;
-webkit-transition:all 0.35s ease-in-out 0.35s;-moz-transition:all 0.35s ease-in-out 0.35s;transition:all 0.35s ease-in-out 0.35s;}
  
.inner_clm4 ul li a:hover .mask1{
-webkit-transform:rotate(45deg) translateX(0.3px);
-moz-transform:rotate(45deg) translateX(0.3px);
-ms-transform:rotate(45deg) translateX(0.3px);
-o-transform:rotate(45deg) translateX(0.3px);
transform:rotate(45deg) translateX(0.3px);
}
.inner_clm4 ul li a:hover .mask2{
-webkit-transform:rotate(45deg) translateX(0px);
-moz-transform:rotate(45deg) translateX(0px);
-ms-transform:rotate(45deg) translateX(0px);
-o-transform:rotate(45deg) translateX(0px);
transform:rotate(45deg) translateX(0px);
}
.inner_clm4 ul li a:hover .info {width:220px;height:160px;top:30px;visibility:visible;
-webkit-transform:rotate(0deg) translate(0, 0);-moz-transform:rotate(0deg) translate(0, 0);-ms-transform:rotate(0deg) translate(0, 0);-o-transform:rotate(0deg) translate(0, 0);transform:rotate(0deg) translate(0, 0);}

.inner_clm4 ul li a:hover .info h3,
.inner_clm4 ul li a:hover .info p{opacity:1;}

@media screen and (max-width:960px){
.inner_clm4 ul{width:640px;margin:0 auto;}
.inner_clm4 ul li{float:none;display:inline-block;margin:0 5px 30px;}
.inner_clm4 ul li:nth-child(4n){float:none;margin:0 5px 30px;}

.inner_clm4 ul li a:hover .mask1,
.inner_clm4 ul li a:hover .mask2,
.inner_clm4 ul li a:hover .info{display:none;}
}
@media screen and (max-width:480px){
.inner_clm4 ul{width:auto;text-align:center;}
.inner_clm4 ul li{margin:0 auto !important;}
}



/* top */
#indx #about{background:url("../images/indx_about_bg01.jpg") no-repeat 50% 50%;background-size:cover;position:relative;z-index:1;
color:#ffffff;margin:0;}
#indx #about .inner{padding:80px 0 0;}
#indx #about p{margin:0 0 80px;font-size:130%;}
#indx #about p.more{width:940px;text-align:right;position:absolute;left:50%;bottom:55px;margin-left:-470px;margin-bottom:0;}
#indx #about p.more a{color:#ffffff;}
@media screen and (max-width:960px){
#indx #about .inner{padding:50px 0 0;}
#indx #about h2.mb50{margin-bottom:30px !important;}
#indx #about p{margin:0 0 30px;}

#indx #about p.more{width:100%;position:relative;left:0;bottom:0;margin-left:0;padding:0 5% 30px;}
}
@media screen and (max-width:768px){
#indx #about p{font-size:115%;}
}
@media screen and (max-width:480px){
#indx #about p{font-size:100%;}
}


#indx #works{padding:165px 0 50px;position:relative;overflow:hidden;}
#indx #works .bg_block{position:absolute;top:0;right:-120px;z-index:0;}
#indx #service{padding:50px 0 80px;position:relative;}
#indx #service .bg_block{position:absolute;bottom:-30px;left:-130px;z-index:0;}
@media screen and (max-width:960px){
#indx #works{padding:50px 0 0;}
#indx #works .bg_block{display:none;}
#indx #service{padding:20px 0;position:relative;}
#indx #service .bg_block{display:none;}
}
@media screen and (max-width:480px){}

#indx #flow{background:url("../images/indx_flow_bg01.jpg") no-repeat 50% 50%;background-size:cover;position:relative;
color:#ffffff;margin:0;}
#indx #flow .inner{padding:80px 0 0;}
#indx #flow p{margin:0 0 80px;font-size:130%;}
#indx #flow p.more{width:940px;text-align:right;position:absolute;left:50%;bottom:55px;margin-left:-470px;margin-bottom:0;}
#indx #flow p.more a{color:#ffffff;}
@media screen and (max-width:960px){
#indx #flow .inner{padding:50px 0 0;}
#indx #flow h2.mb50{margin-bottom:30px !important;}
#indx #flow p{margin:0 0 30px;}

#indx #flow p.more{width:100%;position:relative;left:0;bottom:0;margin-left:0;padding:0 5% 30px;}
}
@media screen and (max-width:768px){
#indx #flow p{font-size:115%;}
}
@media screen and (max-width:480px){
#indx #flow p{font-size:100%;}
}


#indx #info{width:1240px;margin:0 auto;padding:160px 0 0;position:relative;overflow:hidden;}
#indx #info .inner{width:100%;}
#indx #info #social{width:500px;height:455px;float:left;}
#indx #info #map{width:720px;float:right;}
#indx #info #map #map_box{border:solid 1px #eeeeee;padding:15px;margin:0 0 15px;}
#indx #info #map #map_canvas{width:690px;height:425px;margin:0;}
#indx #info .bg_block{position:absolute;top:0;left:350px;z-index:0;}
#indx #info .bg_block img{max-width:none;}
@media screen and (max-width:1250px){
#indx #info{width:100%;}
#indx #info .inner{width:95%;}
#indx #info #social{width:42%;}
#indx #info #map{width:57%;}
#indx #info #map #map_canvas{width:100%;}

.fb-page,
.fb-page span,
.fb-page iframe{width:100% !important;}
}
@media screen and (max-width:960px){
#indx #info{padding:50px 0 0;}
#indx #info .bg_block{display:none;}
}
@media screen and (max-width:640px){
#indx #info .inner{width:85%;}

#indx #info #social{margin:0 0 60px;}
#indx #info #social,
#indx #info #map{width:100%;float:none;}
#indx #info #map #map_canvas{height:300px;}

#indx #info #social{height:301px;border:solid #eeeeee;border-width:0 0 1px;}
.fb-page,
.fb-page span,
.fb-page iframe{height:300px !important;}
}
@media screen and (max-width:480px){
#indx #info #map #map_canvas{height:250px;}

#indx #info #social{height:251px;border:solid #eeeeee;border-width:0 0 1px;}
.fb-page,
.fb-page span,
.fb-page iframe{height:250px !important;}
}

.anc{position:relative;top:-80px;}


/* flow */
#flow{}

.gray_box{border:solid 1px #cccccc;padding:40px 40px 40px 80px;position:relative;}
.gray_box .num{display:inline-block;text-align:center;width:40px;height:28px;line-height:28px;background:#333333;color:#ffffff;font-size:120%;
position:absolute;left:0;}

@media screen and (max-width:960px){
#flow .img_r{max-width:40%;}
}
@media screen and (max-width:640px){
.gray_box{padding:20px 20px 20px 50px;}

#flow .img_r{max-width:50%;}
.smf_block{display:block;}
}


/* about */
#about{}
#about #cont{font-size:110%;}
#about #map{width:960px;margin:0 auto;text-align:left;}
#about #map #map_box{border:solid 1px #eeeeee;padding:15px;margin:0 0 15px;}
#about #map #map_canvas{width:100%;height:425px;margin:0;}

.prof_box{background:url("../about/images/about_bg01.jpg") no-repeat 100% 100%;padding:0 0 50px;} 
.prof_pic{float:right;width:410px;margin:0 0 0 10px;text-align:left;}

.prof dl{float:left;clear:left;margin:0 0 10px;padding-left:20px;}
.prof dt{float:left;width:110px;margin:0 10px 0 0;}
.prof dd{float:left;}

.prof_more{margin-left:140px;}
.prof_more a:after{content:"＋";}
.prof_more a.on:after{content:"－";}

.prof_more_box{display:none;background:#eeeeee;padding:15px;width:550px;margin-bottom:20px;}

@media screen and (max-width:960px){
#about .img_r{max-width:40%;}
#about #map{width:95%;margin:0 auto;}

.prof_box{background:url("../about/images/about_bg01.jpg") no-repeat 100% 100%;background-size:150px;}
.prof_pic{width:30%;}
}
@media screen and (max-width:640px){
#about #cont .pl20{padding-left:0 !important;}
#about #map #map_canvas{height:300px;}

.prof_box{background:none;}

.prof_pic{width:100%;text-align:center;float:none;margin:0 0 15px;}
.prof dl{float:none;margin:0 0 15px;padding-left:0;}
.prof dt{float:none;width:auto;}
.prof dd{float:none;}

.prof_more{margin-left:0;text-align:center;}
.prof_more_box{width:100%;}

#about th{width:23%;}
}
@media screen and (max-width:480px){
#about #map #map_canvas{height:250px;}
}

@media screen and (max-width:960px){
#service .img_r{max-width:40%;margin-left:20px !important;}
}

/* works */
#works #cont{font-size:110%;}

.back{float:right;margin-top:15px;font-size:120%;}
@media screen and (max-width:480px){
.back{float:none;font-size:100%;}
}

.gray_box_pad40{border:solid 1px #cccccc;padding:40px;}

ul.list_clm{}
ul.list_clm li{width:100%;}

ul.list_clm2{}
ul.list_clm2 li{float:left;width:50%;}

ul.list_clm_l{float:left;margin:0 100px 0 0;}
ul.list_clm_r{float:left;margin:0;}

ul.pic_list{}
ul.pic_list li{float:left;margin:0 20px 15px 0;}
ul.pic_list li:nth-child(6n){margin:0 0 15px;}


@media screen and (max-width:960px){
#works .img_r{max-width:40%;}

ul.list_clm2 li{width:45%;margin-right:5%;}

ul.pic_list li{float:none;margin:0 10px 10px 0;display:inline-block;}
ul.pic_list li:nth-child(6n){margin:0 10px 10px 0;}
}
@media screen and (max-width:768px){
.gray_box_pad40{padding:20px;}
ul.list_clm2 li{float:none;width:100%;margin-right:0;}

ul.list_clm_l{margin:0 50px 0 0;}
}
@media screen and (max-width:640px){
#works #cont .pl20{padding-left:0 !important;}

ul.pic_list li{float:left;margin:0 1% 10px 0;display:block;width:32%;}
ul.pic_list li:nth-child(6n){margin:0 1% 10px 0;}

ul.list_clm_l{margin:0 30px 0 0;}
}
@media screen and (max-width:480px){
ul.pic_list li{margin:0 1% 2px 0;}
ul.pic_list li:nth-child(6n){margin:0 1% 2px 0;}
}


/* contact */
.flow{text-align:center;font-size:85%;line-height:1em;margin:0 0 50px;}
.flow li{display:inline-block;background:url("../contact/images/contact_line.gif") repeat-x 100% 50%;padding:0 40px 0 0;margin:0 15px 0 0;}
.flow li:last-child{background:none;padding:0;margin:0;}
.flow li span{display:inline-block;background:#ffffff;border:solid #cccccc;border-width:0 0 0 20px;padding:0 20px 0 10px;}
.flow li.current span{border-color:#33a24d;}
@media screen and (max-width:640px){
.flow li{padding:0 10px 0 0;margin:0 5px 0 0;}
.flow li span{border-width:0 0 0 15px;padding:0 10px 0 5px;}
}
@media screen and (max-width:480px){
.flow{text-align:left;}
.flow li{margin:0 5px 10px 0;}
}

table.form_tbl{border:none;margin:0 0 40px;}
table.form_tbl th{border:none;padding:15px 20px 15px 0;vertical-align:middle;}
table.form_tbl td{border:none;}

table.form_tbl th span{display:inline-block;border:solid #cccccc;border-width:0 0 0 4px;padding:0 0 0 15px;line-height:1.3em;}
table.form_tbl th span.require{border-color:#33a24d;}
span.require{display:inline-block;border:solid #33a24d;border-width:0 0 0 4px;padding:0 0 0 10px;line-height:1.3em;}

input[type="text"]{width:100%;border:solid 1px #eeeeee;background:#eeeeee;height:40px;padding:5px 15px;margin:0;}
input[type="text"]:focus{border:solid 1px #33a24d;outline:0;}
textarea{width:100%;border:solid 1px #eeeeee;background:#eeeeee;padding:15px;margin:0 10px 0 0;}
textarea:focus{border:solid 1px #33a24d;outline:0;}

.radiobtn input{display:none;}
.radiobtn label{display:inline-block;position:relative;cursor:pointer;
margin-left:10px;padding:10px 15px 10px 20px;line-height:1;}
.radiobtn label:last-child{padding:10px 0 10px 20px;}
.radiobtn label:before{position:absolute;content:"";
top:50%;left:-10px;width:22px;height:22px;margin-top:-10px;background:#eeeeee;border-radius:50%;}
.radiobtn input[type="radio"]:checked + label:after{
position:absolute;content:"";
top:50%;left:-4px;width:10px;height:10px;margin-top:-4px;border-radius:50%;background:#33a24d;}

input[type=submit],input[type=button]{width:100%;padding:20px;margin:0;border:none;color:#ffffff;background:#33a24d;font-size:20px;cursor:pointer;
-webkit-transition: all 0.3s ease;-moz-transition: all 0.3s ease;}
input[type=reset]{width:100%;padding:20px;margin:0;border:none;color:#ffffff;background:#33a24d;font-size:20px;cursor:pointer;
-webkit-transition: all 0.3s ease;-moz-transition: all 0.3s ease;}
input[type=submit]:hover,input[type=button]:hover,,input[type=reset]:hover{filter:alpha(opacity=70);-moz-opacity:0.70;opacity:0.70;}

.btn_box{}
.btn_box input[type=submit],
.btn_box input[type=button]{width:48%;float:right;}
.btn_box input[type=reset]{width:48%;float:left;}

@media screen and (max-width:640px){
table.form_tbl th{display:block;width:100% !important;}
table.form_tbl td{display:block;width:100%;margin:0 0 1em;}

table.form_tbl th span{padding:0 0 0 10px;}
span.require{padding:0 0 0 5px;}

input[type=submit],input[type=button],input[type=reset]{padding:15px;}

input[type=submit]:hover,input[type=button]:hover{filter:alpha(opacity=100);-moz-opacity:1;opacity:1;}

.btn_box input[type=submit],
.btn_box input[type=button]{width:100%;float:none;}
.btn_box input[type=reset]{width:100%;float:none;margin:0 0 10px;}
}


/* other */
@media screen and (max-width:480px){
h2.mb50,
p.mb50{margin-bottom:25px !important;}
h3.mb40{margin-bottom:20px !important;}
}



/*------------------------------------------------
   汎用
------------------------------------------------*/

.tx_l{text-align:left !important;}
.tx_c{text-align:center !important;}
.tx_r{text-align:right !important;}

.vm{vertical-align:middle !important;}
.vt{vertical-align:top !important;}
.vb{vertical-align:bottom !important;}

.tx_slarge{font-size:115% !important;}
.tx_large{font-size:120% !important;}
.tx_sxlarge{font-size:135% !important;}
.tx_xlarge{font-size:150% !important;}
.tx_xxlarge{font-size:200% !important;}
.tx_small{font-size:90% !important;}
.tx_xsmall{font-size:75% !important;}


.f_bold{font-weight:bold !important;}
.f_normal{font-weight:normal !important;}

.txt_under{text-decoration:underline !important;}
.txt_strike{text-decoration:line-through !important;}

.inblock{display:inline-block !important;}

.relative{position:relative !important;}

.lh0{line-height:0em !important;}
.lh1{line-height:1em !important;}
.lh15{line-height:1.5em !important;}

ul.note{list-style:none !important;}
ul.note li{text-indent:-1em !important;padding-left:1em !important;}
ul.note li:before{content:"※";}

.note01{padding-left:1em !important;text-indent:-1em !important;}
.note015{padding-left:1.5em !important;text-indent:-1.5em !important;}
.note02{padding-left:2em !important;text-indent:-2em !important;}
.note03{padding-left:3em !important;text-indent:-3em !important;}
.note04{padding-left:4em !important;text-indent:-4em !important;}
.note05{padding-left:5em !important;text-indent:-5em !important;}
.note06{padding-left:6em !important;text-indent:-6em !important;}
.note07{padding-left:7em !important;text-indent:-7em !important;}
.note08{padding-left:8em !important;text-indent:-8em !important;}
.note09{padding-left:9em !important;text-indent:-9em !important;}
.note10{padding-left:10em !important;text-indent:-10em !important;}
.note11{padding-left:11em !important;text-indent:-11em !important;}
.note12{padding-left:12em !important;text-indent:-12em !important;}

.red{color:#ad383b !important;}
.white{color:#ffffff !important;}
.black{color:#333333 !important;}
.green{color:#33a24d !important;}

.w_full{width:100% !important;}
.wauto{width:auto !important;}

.w03em{width:3em !important;}
.w04em{width:4em !important;}
.w05em{width:5em !important;}
.w06em{width:6em !important;}
.w07em{width:7em !important;}
.w08em{width:8em !important;}
.w09em{width:9em !important;}
.w10em{width:10em !important;}
.w11em{width:11em !important;}
.w12em{width:12em !important;}
.w13em{width:13em !important;}
.w14em{width:14em !important;}
.w15em{width:15em !important;}
.w16em{width:16em !important;}
.w17em{width:17em !important;}
.w18em{width:18em !important;}
.w19em{width:19em !important;}
.w20em{width:20em !important;}
.w21em{width:21em !important;}
.w22em{width:22em !important;}
.w23em{width:23em !important;}
.w24em{width:24em !important;}
.w25em{width:25em !important;}
.w26em{width:26em !important;}
.w27em{width:27em !important;}
.w28em{width:28em !important;}
.w29em{width:29em !important;}
.w30em{width:30em !important;}

.w100{width:100px !important;}
.w150{width:150px !important;}
.w200{width:200px !important;}
.w250{width:250px !important;}
.w300{width:300px !important;}
.w350{width:350px !important;}
.w400{width:400px !important;}
.w450{width:450px !important;}
.w500{width:500px !important;}
.w550{width:550px !important;}

.bdr{border:solid 1px #dddddd !important;}
.bdr_none{border:none !important;}

.radius05{-webkit-border-radius:5px !important;-moz-border-radius:5px !important;border-radius:5px !important;}
.radius10{-webkit-border-radius:10px !important;-moz-border-radius:10px !important;border-radius:10px !important;}

.radius_top05{-webkit-border-top-left-radius:5px !important;-webkit-border-top-right-radius:5px !important;-webkit-border-bottom-left-radius:0px !important;-webkit-border-bottom-right-radius:0px !important;-moz-border-radius:5px 5px 0 0 !important;border-radius:5px 5px 0 0; !important;}
.radius_top10{-webkit-border-top-left-radius:10px !important;-webkit-border-top-right-radius:10px !important;-webkit-border-bottom-left-radius:0px !important;-webkit-border-bottom-right-radius:0px !important;-moz-border-radius:10px 10px 0 0 !important;border-radius:10px 10px 0 0; !important;}

.radius_bottom05{-webkit-border-top-left-radius:0px !important;-webkit-border-top-right-radius:0px !important;-webkit-border-bottom-left-radius:5px !important;-webkit-border-bottom-right-radius:5px !important;-moz-border-radius:0 0 5px 5px !important;border-radius:0 0 5px 5px; !important;}
.radius_bottom10{-webkit-border-top-left-radius:0px !important;-webkit-border-top-right-radius:0px !important;-webkit-border-bottom-left-radius:10px !important;-webkit-border-bottom-right-radius:10px !important;-moz-border-radius:0 0 10px 10px !important;border-radius:0 0 10px 10px; !important;}

.mauto{margin:auto !important;}

.mt0{margin-top:0px !important;}
.mt01{margin-top:1px !important;}
.mt05{margin-top:5px !important;}
.mt10{margin-top:10px !important;}
.mt15{margin-top:15px !important;}
.mt20{margin-top:20px !important;}
.mt30{margin-top:30px !important;}
.mt40{margin-top:40px !important;}
.mt50{margin-top:50px !important;}

.mb0{margin-bottom:0px !important;}
.mb05{margin-bottom:5px !important;}
.mb10{margin-bottom:10px !important;}
.mb15{margin-bottom:15px !important;}
.mb20{margin-bottom:20px !important;}
.mb30{margin-bottom:30px !important;}
.mb40{margin-bottom:40px !important;}
.mb50{margin-bottom:50px !important;}

.ml0{margin-left:0px !important;}
.ml05{margin-left:5px !important;}
.ml10{margin-left:10px !important;}
.ml15{margin-left:15px !important;}
.ml20{margin-left:20px !important;}
.ml30{margin-left:30px !important;}
.ml40{margin-left:40px !important;}
.ml50{margin-left:50px !important;}
.ml140{margin-left:140px !important;}


.mr0{margin-right:0px !important;}
.mr01{margin-right:1px !important;}
.mr05{margin-right:5px !important;}
.mr10{margin-right:10px !important;}
.mr15{margin-right:15px !important;}
.mr20{margin-right:20px !important;}
.mr30{margin-right:30px !important;}
.mr40{margin-right:40px !important;}
.mr50{margin-right:50px !important;}

.pt0{padding-top:0 !important;}
.pt05{padding-top:5px !important;}
.pt10{padding-top:10px !important;}
.pt15{padding-top:15px !important;}
.pt20{padding-top:20px !important;}
.pt30{padding-top:30px !important;}
.pt40{padding-top:40px !important;}
.pt50{padding-top:50px !important;}

.pb0{padding-bottom:0 !important;}
.pb05{padding-bottom:5px !important;}
.pb10{padding-bottom:10px !important;}
.pb15{padding-bottom:15px !important;}
.pb20{padding-bottom:20px !important;}
.pb30{padding-bottom:30px !important;}
.pb40{padding-bottom:40px !important;}
.pb50{padding-bottom:50px !important;}

.pl0{padding-left:0 !important;}
.pl05{padding-left:5px !important;}
.pl10{padding-left:10px !important;}
.pl15{padding-left:15px !important;}
.pl20{padding-left:20px !important;}
.pl30{padding-left:30px !important;}
.pl40{padding-left:40px !important;}
.pl50{padding-left:50px !important;}

.pr0{padding-right:0 !important;}
.pr05{padding-right:5px !important;}
.pr10{padding-right:10px !important;}
.pr15{padding-right:15px !important;}
.pr20{padding-right:20px !important;}
.pr30{padding-right:30px !important;}
.pr40{padding-right:40px !important;}
.pr50{padding-right:50px !important;}

.pad0{padding:0 !important;}
.pad05{padding:5px !important;}
.pad10{padding:10px !important;}
.pad15{padding:15px !important;}
.pad20{padding:20px !important;}
.pad30{padding:30px !important;}
.pad40{padding:40px !important;}
.pad50{padding:50px !important;}

.plr05{padding-left:5px !important;padding-right:5px !important;}
.plr10{padding-left:10px !important;padding-right:10px !important;}
.plr15{padding-left:15px !important;padding-right:15px !important;}
.plr20{padding-left:20px !important;padding-right:20px !important;}
.plr30{padding-left:30px !important;padding-right:30px !important;}
.plr40{padding-left:40px !important;padding-right:40px !important;}
.plr50{padding-left:50px !important;padding-right:50px !important;}

.fl{float:left !important;}
.fr{float:right !important;}

.visi{display:block !important;}
.hide{display:none !important;}

.img_l{float:left;margin:0 10px 0 0;}
.img_r{float:right;margin:0 0 0 10px;}

.alignleft{float:left;margin:0 10px 5px 0;}
.alignright{float:right;margin:0 0 5px 10px;}
.aligncenter{clear:both;display:block;margin-left:auto;margin-right:auto;}

/* clearfix */
.cls{clear:both;}
/* For modern browsers */
.cf:before,
.cf:after{content:"";display:table;} 
.cf:after{clear:both;}
/* For IE 6/7 (trigger hasLayout) */
.cf{zoom:1;}/* clearfixここまで */
/* 汎用ここまで */