@charset "utf-8";

/***********************************************************
  各ページ固有スタイルシート
************************************************************/
/*-----------------------------------------------------------
 indexページ
-----------------------------------------------------------*/
/* タイトル周り
-----------------------------------------------------------*/
#cnrtop_main_msg{
position:relative;
}
#cnrtop_main_msg .idxpage_lead{
padding:75px 520px 0 50px!important;
height:197px; /* 272 */

}
#cnrtop_mainvisual{
position:absolute;
top:-67px;
right:0px;
}

/* ブランド商品
-----------------------------------------------------------*/
.framebox_ptn1{
padding:9px 9px 9px 30px;
border:1px solid #cccccc;
}
.framebox_ptn1_floatnone{
padding:9px 30px;
border:1px solid #cccccc;
}

.h3_wrapper_ptn1{
position:relative;
margin-bottom:30px;
height:60px;
border-bottom:4px solid #396091;
}
.h3_wrapper_ptn1 h3{
padding-top:12px;
}
.h3_wrapper_ptn1 .btn_todetail{
position:absolute;
top:15px;
right:0px;
}

.h3_wrapper_ptn2{}
.h3_wrapper_ptn2 h3{
font-size:150%;
}

.framebox_ptn1 h4,
.framebox_ptn1_floatnone h4{
margin-bottom:16px;
font-size:112.5%;
font-weight:bold;
color:#333333;
}

.h3_wrapper_ptn3{
position:relative;
}
.h3_wrapper_ptn3 h3{
padding-top:20px;
padding-bottom:16px;
font-size:128.5%;
}
.h3_wrapper_ptn3 .btn_todetail{
position:absolute;
top:12px;
right:0px;
}


.h3_wrapper_ptn4{ /* 丸和トップなど */
position:relative;
margin-bottom:10px;
height:40px;
border-bottom:4px solid #396091;
}
.h3_wrapper_ptn4 h3{
padding-top:10px!important;
font-size:107%!important;
}
.h3_wrapper_ptn4 .btn_todetail{
position:absolute;
top:2px;
right:0px;
}



/* 仕入製品
-----------------------------------------------------------*/
.framebox_ptn2_wrapper{
width:858px;
border-top:1px solid #cccccc;
border-left:1px solid #cccccc;
}

.framebox_ptn2{
padding:9px 28px 9px 30px;
width:370px;

border-right:1px solid #cccccc;
border-bottom:1px solid #cccccc;
}

.framebox_ptn2 .h3_wrapper_ptn1{
position:relative;
margin-bottom:10px;
height:40px;
border-bottom:4px solid #396091;
}
.framebox_ptn2 h3{
padding-top:12px;
font-size:112.5%;
font-weight:bold;
color:#333333;
}




.wdth_120{width:120px!important;}
.wdth_182{width:182px!important;}


/* 取扱製品
-----------------------------------------------------------*/
#prd_other{}

.framebox_ptn3_wrapper{
padding:30px 30px 20px;
border:1px solid #cccccc;
}

.framebox_ptn3_wrapper h4{
margin-bottom:10px;
padding-left:16px;
font-weight:bold;
color:#333333;
background-image:url(../common/img/bg/bg_square_ptn1.gif);
background-repeat:no-repeat;
background-position:left top;
}

.framebox_ptn3_wrapper ul{}

.framebox_ptn3_wrapper li{
margin-bottom:8px;
padding-left:12px;
background-image:url(../common/img/bg/bg_dot_ptn1.png);
background-repeat:no-repeat;
background-position:4px 4px;
}


/* 海外建材事業
-----------------------------------------------------------*/
.wdth_438{width:438px!important;}





/*-----------------------------------------------------------
 大川丸和トップページ
-----------------------------------------------------------*/
/* リンクベルト
-----------------------------------------------------------*/
.linkbelt_brown{
background-color:#a78844;
}
.linkbelt_brown .linkbelt_inner{
padding:30px 50px;
}

.wdth_207{width:207px!important;}

.linkbelt_brown .linkbelt_inner .clmn_box{
background-color:#ffffff;
}

.linkbelt_brown .linkbelt_inner .clmn_box p{
margin:0 10px;
padding:20px 10px;
background-color:#f2ede2;
}

/* h2 */
.linkbelt_brown .linkbelt_inner .clmn_box h3{}
.linkbelt_brown .linkbelt_inner .clmn_box h3:hover{}
.linkbelt_brown .linkbelt_inner .clmn_box h3 a{
display:block;
padding:20px 0 18px 16px;
font-size:171.4%;
color:#333333;
background-color:#ffffff;
background-image:url(../common/img/bg/bg_arrow_01.png);
background-repeat:no-repeat;
background-position:90% 50%;
transition: background-color 0.2s ease-in;
}
.linkbelt_brown .linkbelt_inner .clmn_box h3 a:hover{
text-decoration:none;
background-color:#ffffea;
}


/*-----------------------------------------------------------
 「HISHI WALL」ページ
-----------------------------------------------------------*/
/* メインタイトル
-----------------------------------------------------------*/
.mainttl_sub{
font-size:66.67%;
}

/* 上部2カラムボックス
-----------------------------------------------------------*/
.wdth_425{width:425px!important;}

/* 専用ライン工程
-----------------------------------------------------------*/
.process_box{
background-color:#eeeeee;
}

.process_box .process_desc{
width:429px;
}
.process_ptn1 .process_desc{
background-color:#4067cb;
}
.process_ptn2 .process_desc{
background-color:#6282d4;
}

.process_box .process_desc h3{
position:relative;
margin-bottom:20px;
padding-left:82px;
color:#ffffff;
}
.process_box .process_desc h3.process_ttl_1l{
padding-top:22px;
height:45px;
}
.process_box .process_desc h3.process_ttl_2l{
padding-top:12px;
height:55px;
}

.process_box .process_desc h3 .process_num{
position:absolute;
top:0px;
left:0px;
width:72px;
height:67px;
font-size:450%;
font-family:Arial, sans-serif;
line-height:1.1;
text-align:center;
background-color:#80a2e4;
}

.process_box .process_desc h3 .process_ttl{
font-size:142.8%;
line-height:1.2;
}

.process_box .process_desc h4{
margin-bottom:7px;
padding-left:20px;
color:#ffffff;
}

.process_box .process_desc ul{}
.process_box .process_desc li{
margin-bottom:7px;
padding-left:36px;
padding-right:20px;
line-height:1.2;
color:#ffffff;
background-image:url(../common/img/bg/bg_dot_ptn2.png);
background-repeat:no-repeat;
background-position:26px 4px;
}

.process_box .process_fig{
padding:13px 10px;
}

.process_desc_fig_wrapper{
padding:0 20px;
}
.process_desc_fig_wrapper .fig_cap_wrapper{
width:192px!important;
}
.process_desc_fig_wrapper .fig_cap_wrapper .fig_box{
padding:5px 0;
text-align:center;
background-color:#ffffff;
}

.process_desc_fig_wrapper .fig_cap_wrapper .fig_caption{
font-size:87.5%;
color:#ffffff;
}



/*-----------------------------------------------------------
 会社情報ページ
-----------------------------------------------------------*/
/* 企業名
-----------------------------------------------------------*/
#cmp_name{}

#cmp_name h2{
padding-top:38px;
}

#cmp_name h2 .name_jp{
font-size:171.4%;
}

/* 一覧表
-----------------------------------------------------------*/
.wdth_100{width:100px!important;}

/* マップ
-----------------------------------------------------------*/
#cmp_map{}

#cmp_map h2{
font-size:171.4%;
}



/*-----------------------------------------------------------
 取扱品目ページ
-----------------------------------------------------------*/
/* 一覧表
-----------------------------------------------------------*/
.wdth_180{width:180px!important;}



/*-----------------------------------------------------------
 保有設備ページ
-----------------------------------------------------------*/
/* 一覧表
-----------------------------------------------------------*/



/*-----------------------------------------------------------
 使用素材ページ
-----------------------------------------------------------*/
/* 一覧表
-----------------------------------------------------------*/



/*-----------------------------------------------------------
 大川丸和の実績ページ
-----------------------------------------------------------*/
/* 抽出ボタン: Filter
-----------------------------------------------------------*/
#filter_wrapper{
padding:50px 0 40px 50px;
background-color:#e4e4e4;
}

#filter_wrapper p{
margin-bottom:16px;
}

#filters{
margin:0 auto;
}

#filters li{
float:left;
margin-right:10px;
}

#filters li a{
display:block;
text-align:center;
color:#333333;
background-color:#ffffff;
overflow:hidden;
transition: background-color 0.2s ease-in;
}
#filters li a.selected,
#filters li a:hover{
text-decoration:none;
color:#ffffff;
background-color:#396091;
}

/* すべて表示 */
#filters li#filter_all{
float:left;
width:206px;
}
#filters li#filter_all a{
padding-top:76px;
/* height:170px; */
height:94px;
}

/* 抽出メニュー */
#filters li.filter_each{
margin-bottom:10px;
width:208px;
}
#filters li.filter_each a{
height:50px;
}

#filters li.filter_each .inner_2l a{
padding-top:10px;
/* height:50px; */
height:40px;
font-size:87.5%;
line-height:1.2;
}

#filters li.filter_each .inner_1l a{
padding-top:16px;
/* height:50px; */
height:34px;
font-size:112.5%;
line-height:1.2;
}


/* 実績リスト
-----------------------------------------------------------*/
#archives_wrapper{
margin:0 auto;
padding:50px 0 40px 50px;
width:960px;
}

ul#archives{}

/* 写真フレーム */
li.frame_ph{
float:left;
margin-right:10px;
margin-bottom:10px;
width:208px;
overflow:hidden;
}

.frame_ph_inner{
padding:9px;
/*
padding:5px;
*/
border:1px solid #ececec;
overflow:hidden;
}

.frame_ph_inner a{
display:block;
margin:9px;
height:125px;
overflow:hidden;
}

/* HoverImgを初期化 */
.frame_ph_inner a:hover img{
filter: alpha(opacity=100);
-moz-opacity:1.0;
opacity:1.0;
}

.frame_ph_inner img{
width:100%;
height:auto;
background-color:#000000;
filter: alpha(opacity=70);
-moz-opacity:0.7;
opacity:0.7;

-webkit-filter:grayscale(100%);
-moz-filter:grayscale(100%);
-ms-filter:grayscale(100%);
-o-filter:grayscale(100%);
filter:grayscale(100%);
filter: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg'><filter id='grayscale'><feColorMatrix type='matrix' values='0.3333 0.3333 0.3333 0 0 0.3333 0.3333 0.3333 0 0 0.3333 0.3333 0.3333 0 0 0 0 0 1 0'/></filter></svg>#grayscale");
filter:gray;
-webkit-transition:0.5s;
-moz-transition:0.5s;
-o-transition:0.5s;
transition:0.5s;
}
.frame_ph_inner a:hover img{
-webkit-filter:grayscale(0%);
-moz-filter:grayscale(0%);
-ms-filter:grayscale(0%);
-o-filter:grayscale(0%);
filter:grayscale(0%);
filter:url(grayscale.svg);
/* Firefox 4+ */
filter:none;
/* IE 6-9 */
}


/* 実績オーバーレイ
-----------------------------------------------------------*/
/* 全体 */
.ov_item{
display:none;
}

/* オーバーレイコンテンツのスタイリング */
/* ボックス全体 */
.ov_set{
margin:0 auto;
width:680px;
/*
height:600px;
*/
background-color:#ffffff;
}

.ov_set_inner{
padding:20px;
/*padding:20px 20px 90px;*/
}

/* 画像フレーム */
.ov_photo{
margin-bottom:20px;
/*
max-width:640px;
*/
text-align:center;
}

/* 説明フレーム */
.ov_desc{
padding:4px 0 0 15px;
border-left:9px solid #cccccc;
}

/* カテゴリ */
.ov_ctgr{
margin-bottom:8px;
font-size:85.7%!important;
color:#333333;
}

/* タイトル */
.ov_ttl{
margin-bottom:6px;
font-size:112.5%!important;
font-weight:bold;
color:#333333;
}

/* キャプション: 担当企業名など */
.ov_cptn{
font-size:85.7%!important;
color:#333333;
}



/* 汎用
-----------------------------------------------------------*/
.note{font-size:85.7%!important;}
.fw_n{font-weight:normal;}