@charset "shift_jis";

/***********************************************************************/
/* redefined tags                                                      */
/***********************************************************************/

body
{
  margin:0;
  padding:0;
  font-family: "ＭＳ ゴシック", sans-serif;
  color:#303030;
  font-size:12px;
  background:#FFFFFF url("../img/common/topline.gif") repeat-x;
}

#cd
{
   width:960px;
   margin:0 auto;
   padding:0;
}

h1
{
  font-size:10px;
  font-weight:normal;
  color:#000;
  text-indent:-9999px;
  margin:0px;
  padding:0px;
}

h2
{
  width:773px;
  height:23px;
  font-size:10px;
  text-indent:-9999px;
  margin:0 0 40px 0;
  padding:0px;
}

h3
{
  height:19px;
  font-size:10px;
  text-indent:-9999px;
  margin:40px 0 10px 0;
  padding:0px;
}

#rightConts h3 {
  position: relative;
  margin: 30px 0 10px 0;
  padding: 8px 10px 8px 25px;
  font-size: 19px;
  color: #1b3155;
}

#rightConts h3::before {
  content: "";
  position: absolute;
  left: 0;
  top: 50%;
  transform: translateY(-50%);
  width: 18px;
  height: 18px;
  background: #1b3155;
  border-radius: 5px;
}

#rightConts h3::after {
  content: "";
  position: absolute;
  left: 5px;
  top: 50%;
  transform: translateY(-35%);
  width: 0;
  height: 0;
  border-left: 4px solid transparent;
  border-right: 4px solid transparent;
  border-top: 5px solid #fff;
}
p
{
  padding:0;
  margin:0;
  color:#000;
  font-family:Arial, Helvetica, sans-serif;
  line-height:1.8em;
}

img
{
  border:0px;
  margin:0;
padding:0;
}

a img
{margin:0;
padding:0;
border:0px;
}

table tr td {padding:5px;}

/***********************************************************************/
/* main layout                                                         */
/***********************************************************************/


#leftConts
{
   width:148px;
   margin:70px 0 0 0;
   padding:0px;
   float:left;
}

#logos
{
   width:148px;
   height:148px;
   margin:0;
   padding:0;
}

#leftNav
{
   width:148px;
   margin:12px 0 0 0;
   padding:0;
height:350px;
}


#leftNav ul
{
list-style-type:none;
margin:0;
padding:0;
} 

#leftNav ul li
{
height:35px;
margin:0;
padding:0;
}
#leftNav ul li a
{
  display: block;
  height: 34px;
  line-height: 34px;
  border-bottom: 1px solid #cccccc;
  color: #303030;
  font-family: "Hiragino Mincho ProN", "Yu Mincho", "ＭＳ Ｐ明朝", serif;
  font-size: 14px;
  text-decoration: none;
}
#leftNav ul li a:hover
{
  color: #01436A;
  border-bottom-color: #01436A;
  background: none;
}
#rightConts
{
width:773px;
margin:70px 0 15px 27px;
padding:0 0 50px 0;
float:right;
}

#rightConts a:link {color:#01436A; text-decoration: none;}

#rightConts a:visited {color:#006699; text-decoration: none;}

#rightConts a:hover {color:#FFFFFF;background-color: #01436A; text-decoration: none;}

#rightConts a:active {color:#01436A; text-decoration: none;}


#footer
{
   width:960px;
   margin:0 auto 15px auto;
   padding:15px 0;
   text-align:right;
   background:url("../img/common/footerline.gif") right top no-repeat;
}

#footer p
{
   color:#01436A;
   font-size:10px;
}

/***********************************************************************/
/* top layout                                                         */
/***********************************************************************/

#rightConts_top
{
width:773px;
margin:70px 0 0 27px;
padding:0;
float:right;
}

#footer_top
{
   width:960px;
   margin:20px auto;
   padding:0;
   text-align:right;

}

#footer_top p
{
   color:#01436A;
   font-size:10px;
}

/***********************************************************************/
/* about layout                                                         */
/***********************************************************************/

#about
{
  width: auto;
  height: auto;
  margin: 0 0 40px 0;
  padding: 0 0 10px 0;
  color: #303030;
  font-family: "Hiragino Mincho ProN", "Yu Mincho", "ＭＳ Ｐ明朝", serif;
  font-size: 28px;
  font-weight: bold;
  line-height: 1.4;
  text-indent: 0;
  background: none;
  border-bottom: 1px solid #cccccc;
}

#about span
{
  margin-left: 12px;
  color: #01436A;
  font-family: Arial, Helvetica, sans-serif;
  font-size: 14px;
  font-weight: normal;
}

#about_1,
#about_n,
#about_o,
#about_2,
#about_3,
#about_4
{
  width: auto;
  height: auto;
  margin: 40px 0 10px 0;
  padding: 0 0 8px 0;
  color: #303030;
  font-family: "Hiragino Mincho ProN", "Yu Mincho", "ＭＳ Ｐ明朝", serif;
  font-size: 20px;
  font-weight: bold;
  text-indent: 0;
  line-height: 1.4;
  background: none;
  border-bottom: 1px solid #cccccc;
}

#about_n,
#about_o
{
  margin-top: 20px;
}

.aboutInfo
{
  width:300px;
  float:left;
}

.aboutInfoLeft
{
  padding-right:30px;
}
.aboutOffice
{
  width:300px;
  float:left;
}

.aboutOfficeLeft
{
  padding-right:30px;
}
/***********************************************************************/
/* plofile layout                                                         */
/***********************************************************************/

#profile
{
  width: auto;
  height: auto;
  margin: 0 0 40px 0;
  padding: 0 0 10px 0;
  color: #303030;
  font-family: "Hiragino Mincho ProN", "Yu Mincho", "ＭＳ Ｐ明朝", serif;
  font-size: 28px;
  font-weight: bold;
  line-height: 1.4;
  text-indent: 0;
  background: none;
  border-bottom: 1px solid #cccccc;
}

#profile_1,
#profile_2
{
  width: auto;
  height: auto;
  margin: 40px 0 10px 0;
  padding: 0 0 8px 0;
  color: #303030;
  font-family: "Hiragino Mincho ProN", "Yu Mincho", "ＭＳ Ｐ明朝", serif;
  font-size: 20px;
  font-weight: bold;
  text-indent: 0;
  line-height: 1.4;
  background: none;
  border-bottom: 1px solid #cccccc;
}
.profileIntro
{
  width:773px;
}

.profilePhoto
{
  margin-right:30px;
  float:left;
}

.profileText
{
  width:595px;
  margin:0;
  padding:0;
  float:right;
}
#profile span
{
  margin-left: 12px;
  color: #01436A;
  font-family: Arial, Helvetica, sans-serif;
  font-size: 14px;
  font-weight: normal;
}

/***********************************************************************/
/* identity & anonymity　work layout                                   */
/***********************************************************************/

#identity,
#anonymity,
#workTitle
{
  width: auto;
  height: auto;
  margin: 0 0 40px 0;
  padding: 0 0 10px 0;
  color: #303030;
  font-family: "Hiragino Mincho ProN", "Yu Mincho", "ＭＳ Ｐ明朝", serif;
  font-size: 28px;
  font-weight: bold;
  line-height: 1.4;
  text-indent: 0;
  background: none;
  border-bottom: 1px solid #cccccc;
}

#identity span,
#anonymity span,
#workTitle span
{
  margin-left: 12px;
  color: #01436A;
  font-family: Arial, Helvetica, sans-serif;
  font-size: 14px;
  font-weight: normal;
}

#identity_thumb img
{
margin-right:4px;
float:left;
}


/***********************************************************************/
/* workflow layout                                                         */
/***********************************************************************/

#workflow
{
  width: auto;
  height: auto;
  margin: 0 0 40px 0;
  padding: 0 0 10px 0;
  color: #303030;
  font-family: "Hiragino Mincho ProN", "Yu Mincho", "ＭＳ Ｐ明朝", serif;
  font-size: 28px;
  font-weight: bold;
  line-height: 1.4;
  text-indent: 0;
  background: none;
  border-bottom: 1px solid #cccccc;
}

#workflow span
{
  margin-left: 12px;
  color: #01436A;
  font-family: Arial, Helvetica, sans-serif;
  font-size: 14px;
  font-weight: normal;
}

#workflow_1,
#workflow_2,
#workflow_3,
#workflow_4,
#workflow_5,
#workflow_6
{
  width: auto;
  height: auto;
  margin: 40px 0 10px 0;
  padding: 0 0 8px 0;
  color: #303030;
  font-family: "Hiragino Mincho ProN", "Yu Mincho", "ＭＳ Ｐ明朝", serif;
  font-size: 20px;
  font-weight: bold;
  text-indent: 0;
  line-height: 1.4;
  background: none;
  border-bottom: 1px solid #cccccc;
}
#rightConts table
{
  border-collapse: collapse;
}

#rightConts table td
{
  padding: 3px 5px;
}
/***********************************************************************/
/* anonymity layout                                                         */
/***********************************************************************/

.linklist li
{margin:0 0 8px 0;}

/***********************************************************************/
/* link layout                                                         */
/***********************************************************************/

#link
{
  width: auto;
  height: auto;
  margin: 0 0 40px 0;
  padding: 0 0 10px 0;
  color: #303030;
  font-family: "Hiragino Mincho ProN", "Yu Mincho", "ＭＳ Ｐ明朝", serif;
  font-size: 28px;
  font-weight: bold;
  line-height: 1.4;
  text-indent: 0;
  background: none;
  border-bottom: 1px solid #cccccc;
}

#link span
{
  margin-left: 12px;
  color: #01436A;
  font-family: Arial, Helvetica, sans-serif;
  font-size: 14px;
  font-weight: normal;
}

#link_1,
#link_2
{
  width: auto;
  height: auto;
  margin: 40px 0 10px 0;
  padding: 0 0 8px 0;
  color: #303030;
  font-family: "Hiragino Mincho ProN", "Yu Mincho", "ＭＳ Ｐ明朝", serif;
  font-size: 20px;
  font-weight: bold;
  text-indent: 0;
  line-height: 1.4;
  background: none;
  border-bottom: 1px solid #cccccc;
}


/***********************************************************************/
/* work layout                                                         */
/***********************************************************************/

#work
{
  width: auto;
  height: auto;
  margin: 0 0 40px 0;
  padding: 0 0 10px 0;
  color: #303030;
  font-family: "Hiragino Mincho ProN", "Yu Mincho", "ＭＳ Ｐ明朝", serif;
  font-size: 28px;
  font-weight: bold;
  line-height: 1.4;
  text-indent: 0;
  background: none;
  border-bottom: 1px solid #cccccc;
}

#work span
{
  margin-left: 12px;
  color: #01436A;
  font-family: Arial, Helvetica, sans-serif;
  font-size: 14px;
  font-weight: normal;
}

#workBox
{
width:740px;
}

#thumPhoto
{
  width:740px;
  margin:0 0 40px 0;
  padding:0px;
  font-size: 0;
}
.work-icon-box{
position: relative;
width: 120px;
height: 120px;
background: #000;
margin:0 4px 4px 0;
float:left;
}
.work-icon-text {
  position: absolute;
  width: 100%;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  color: #fff;
  font-size: 12px;
  text-align: center;
  text-shadow: 0px 0px 3px rgb(61 70 70);
}
#thumPhoto a
{
  display: inline-block;
  vertical-align: top;
  margin: 0 4px 4px 0;
  line-height: 0;
}

#thumPhoto a:hover
{
  background: none;
  box-shadow: inset 0 -1px 0 #1b3155;
  opacity: 0.7;
}
#mainConts
{
width:736px;
margin-right:4px;
padding:0;
}

#mainConts img
{
margin:0 0 0 30px;
float:right;
}


#workData
{
color:#4D4D3E;
font-size:10px;
font-family:Arial, Helvetica, sans-serif;
padding-Top:20px;
line-height:1.2em;
}

.heiho
{
font-size:6px;
font-family:Arial, Helvetica, sans-serif;
vertical-align:super;
line-height:1.5em;
}
#workBack
{
  position: relative;
  margin: 20px 0 10px 0;
  padding: 8px 10px 8px 0;
}
#workBack a
{
  display: inline-block;
  position: relative;
  padding-left: 25px;
  color: #1b3155;
  background: none;
  font-weight: normal;
}

#workBack a:hover
{
  color: #1b3155;
  background: none;
  font-weight: bold;
}
#workBack a:hover::before
{
  left: 3px;
}

#workBack a:hover::after
{
  left: 10px;
}

#workBack img
{
margin:0;
float:left;
}

#workBack a::before
{
  content: "";
  position: absolute;
  left: 0;
  top: 50%;
  transform: translateY(-50%);
  width: 18px;
  height: 18px;
  background: #1b3155;
  border-radius: 5px;
}

#workBack a::after
{
  content: "";
  position: absolute;
  left: 7px;
  top: 50%;
  transform: translateY(-50%);
  width: 0;
  height: 0;
  border-top: 4px solid transparent;
  border-bottom: 4px solid transparent;
  border-left: 5px solid #fff;
}

.workGallerySP
{
  display: none;
}
/***********************************************************************/
/* work title                                                         */
/***********************************************************************/
#work-title
{
  color: black;
  text-indent:0px;
  font-family: "ヒラギノ明朝","ＭＳ 明朝","serif";
  font-weight: bold;
  font-size: 23px;
}

#work-title span
{
  color:#013351;
  text-indent:10px;
  font-family: "メイリオ","ヒラギノ角ゴシック","sans-serif";
  font-weight:bold;
  font-size: 12px;
}


#aura
{
  background:url("../lightbox/images/aur/h2.gif") no-repeat left bottom;
}

#gama
{
  background:url("../lightbox/images/gama/h2.gif") no-repeat left bottom;
}

#ha
{
  background:url("../lightbox/images/ha/h2.gif") no-repeat left bottom;
}

#hainoki
{
  background:url("../lightbox/images/hainoki/h2.gif") no-repeat left bottom;
}

#hik
{
  background:url("../lightbox/images/hik/h2.gif") no-repeat left bottom;
}

#hn
{
  background:url("../lightbox/images/hn/h2.gif") no-repeat left bottom;
}

#ho
{
  background:url("../lightbox/images/ho/h2.gif") no-repeat left bottom;
}

#nissin
{
  background:url("../lightbox/images/nissin/h2.gif") no-repeat left bottom;
}

#ohirune
{
  background:url("../lightbox/images/ohirune/h2.gif") no-repeat left bottom;
}

#ohirune2
{
  background:url("../lightbox/images/ohirune2/h2.gif") no-repeat left bottom;
}

#sg
{
  background:url("../lightbox/images/sg/h2.gif") no-repeat left bottom;
}

#easthouse
{
  background:url("../lightbox/images/easthouse/h2.gif") no-repeat left bottom;
}

#hk
{
  background:url("../lightbox/images/hk/h2.gif") no-repeat left bottom;
}

#ht1
{
  background:url("../lightbox/images/ht1/h2.gif") no-repeat left bottom;
}

#ht2
{
  background:url("../lightbox/images/ht2/h2.gif") no-repeat left bottom;
}
#kiyosu
{
  background:url("../lightbox/images/kiyosu/h2.gif") no-repeat left bottom;
}
#kani
{
  background:url("../lightbox/images/kani/h2.gif") no-repeat left bottom;
}
#tomei
{
  background:url("../lightbox/images/tomei/h2.gif") no-repeat left bottom;
}
#ohirune2015
{
  background:url("../lightbox/images/2015-ohirune/h2.gif") no-repeat left bottom;
}
#sicyu2015
{
  background:url("../lightbox/images/2015-sicyu/h2.gif") no-repeat left bottom;
}
#suisyo2015
{
  background:url("../lightbox/images/2015-suisyo/h2.gif") no-repeat left bottom;
}
#ta2015
{
  background:url("../lightbox/images/2015-ta/h2.gif") no-repeat left bottom;
}


/***********************************************************************/
/* responsive 2026対応                                                 */
/***********************************************************************/

#navToggle
{
  display: none;
}

.navText
{
  display: inline;
}

@media screen and (max-width: 767px)
{
  body
  {
    min-width: 0;
  }

  #cd
  {
    width: auto;
    margin: 0;
    padding: 0 15px;
  }

  #leftConts
{
  position: relative;
  width: auto;
  margin: 20px 0 30px 0;
  float: none;
}

  #logos
  {
    margin: 0 auto;
  }


#navToggleLabel
{
  display: flex;
  position: fixed;
  top: 5px;
  right: 5px;
  z-index: 1000;

  width: 45px;
  height: 40px;
  margin: 0;
  padding: 0;

  flex-direction: column;
  align-items: center;
  justify-content: center;

  cursor: pointer;
background: rgba(255, 255, 255, 0.9);
  border-radius: 3px;
}

#navToggleLabel span
{
  display: block;
  width: 30px;
  height: 2px;
  margin: 3px 0;
  background: #01436A;
}

#leftNav
{
  position: fixed;
  top: 0;
  left: 0;
  z-index: 999;

  width: 100%;
  height: 0;
  margin: 0;
  padding-top: 70px;

  overflow: hidden;
  opacity: 0;
  background: #eeeeee;

  transition: height 0.4s ease, opacity 0.3s ease;
}

#navToggle:checked ~ #leftNav
{
  height: 100vh;
  margin: 0;
  opacity: 1;
}

#leftNav ul
{
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
}

#leftNav ul li
{
  width: 100%;
  height: auto;
  margin: 0;
  padding: 0;
  text-align: center;
}

#leftNav ul li img
{
  display: none;
}

#leftNav ul li a
{
  display: block;
  padding: 13px 0;
  border-bottom: 1px solid #cccccc;
  color: #303030;
  font-family: "Hiragino Mincho ProN", "Yu Mincho", "ＭＳ Ｐ明朝", serif;
  font-size: 16px;
  text-decoration: none;
}

#leftNav ul li a:hover
{
  color: #303030;
  background: none;
}

.navText
{
  display: inline;
}

  #rightConts,
  #rightConts_top
  {
    width: auto;
    margin: 0;
    padding: 0 0 30px 0;
    float: none;
  }
  #rightConts img,
  #rightConts_top img
{
  display: block;
  width: 100%;
  max-width: 100%;
  height: auto;
  margin: 0;
  float: none !important;
}
  #footer,
  #footer_top
  {
    width: auto;
    margin: 20px 15px;
  }

  h2
  {
    max-width: 100%;
  }

#workBox,
#mainConts
{
  width: auto;
}

/* 建築実績一覧 */
#thumPhoto
{
  display: grid !important;
  grid-template-columns: repeat(3, 1fr) !important;
  gap: 4px;
  width: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
}

#thumPhoto .work-icon-box
{
  width: auto !important;
  height: auto !important;
  aspect-ratio: 1 / 1;
  margin: 0 !important;
  padding: 0 !important;
  float: none !important;
  overflow: hidden;
}

#thumPhoto .work-icon-box img
{
  width: 100% !important;
  height: 100% !important;
  margin: 0 !important;
  object-fit: cover;
}

  #mainConts img
  {
    max-width: 100%;
    height: auto;
  }

  #identity_thumb img
  {
    max-width: 100%;
    height: auto;
  }
	
/***********************************************************************/
/* about レスポンシブ                                                    */
/***********************************************************************/
	
#about
{
  margin: 0 0 30px 0;
  font-size: 23px;
}

#about span
{
  display: block;
  margin: 4px 0 0 0;
  font-size: 11px;
}

#about_1,
#about_n,
#about_o,
#about_2,
#about_3,
#about_4
{
  margin: 30px 0 10px 0;
  font-size: 19px;
  color: #1f3a5f;
}
.aboutOffice,
.aboutOfficeLeft
{
  width: auto !important;
  float: none !important;
  padding-right: 0 !important;
  margin-bottom: 40px;
}

.aboutOffice img
{
  width: 100%;
  height: auto;
}
.aboutInfo,
.aboutInfoLeft
{
  width:auto;
  float:none;
  padding-right:0;
}
/***********************************************************************/
/* plofile レスポンシブ                                                  */
/***********************************************************************/
.profileIntro
{
  width:auto;
}
.profilePhoto
{
  display: block;
  width: 120px !important;
  height: 120px !important;
  margin: 0 auto 20px auto !important;
  float: none !important;
  border-radius: 50%;
  object-fit: cover;
}

.profileText
{
  width:auto;
  float:none;
}
#profile
{
  margin: 0 0 30px 0;
  font-size: 23px;
}

#profile_1,
#profile_2
{
  margin: 30px 0 10px 0;
  font-size: 19px;
  color: #1f3a5f;
}
#profile span
{
  display: block;
  margin: 4px 0 0 0;
  font-size: 11px;
}
/***********************************************************************/
/* work レスポンシブ                                                     */
/***********************************************************************/

#work
{
  width: auto;
  height: auto;
  margin: 0 0 30px 0;
  padding: 0 0 10px 0;
  color: #303030;
  font-family: "Hiragino Mincho ProN", "Yu Mincho", "ＭＳ Ｐ明朝", serif;
  font-size: 23px;
  font-weight: bold;
  line-height: 1.4;
  text-indent: 0;
  background: none;
  border-bottom: 1px solid #cccccc;
}

#work span
{
  display: block;
  margin: 4px 0 0 0;
  color: #01436A;
  font-family: Arial, Helvetica, sans-serif;
  font-size: 11px;
  font-weight: normal;
}

/* 建築実績サムネイル */
#thumPhoto
{
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 4px;
  width: 100%;
  margin: 0;
  padding: 0;
}

#thumPhoto .work-icon-box
{
  position: relative;
  width: 100%;
  height: auto;
  aspect-ratio: 1 / 1;
  margin: 0 !important;
  padding: 0;
  float: none;
  overflow: hidden;
  background: #000;
}

/* サムネイル画像 */
#thumPhoto .work-icon-box img
{
  display: block;
  width: 100%;
  height: 100%;
  max-width: none;
  margin: 0;
  object-fit: cover;
}

/* スマホでは最初からカラー */
#thumPhoto .work-icon-box img[src*="icon_off"]
{
  filter: none;
}

/* タイトル */
#thumPhoto .work-icon-text
{
  position: absolute;
  top: 50%;
  left: 50%;
  width: 100%;
  margin: 0;
  padding: 0 5px;
  transform: translate(-50%, -50%);
  color: #fff;
  font-family: Arial, Helvetica, sans-serif;
  font-size: 12px;
  line-height: 1.4;
  text-align: center;
  text-shadow: 0 0 3px rgba(0,0,0,0.8);
}

/* リンク部分も全面クリック可能にする */
#thumPhoto .work-icon-box a
{
  display: block;
  width: 100%;
  height: 100%;
}
/***********************************************************************/
/* workflow レスポンシブ                                                 */
/***********************************************************************/
#workflow
{
  margin: 0 0 30px 0;
  font-size: 23px;
}

#workflow span
{
  display: block;
  margin: 4px 0 0 0;
  font-size: 11px;
}

#workflow_1,
#workflow_2,
#workflow_3,
#workflow_4,
#workflow_5,
#workflow_6
{
  margin: 30px 0 10px 0;
  font-size: 19px;
  color: #1f3a5f;
}
/***********************************************************************/
/* link レスポンシブ                                                     */
/***********************************************************************/
#link
{
  margin: 0 0 30px 0;
  font-size: 23px;
}
#link span
{
  display: block;
  margin: 4px 0 0 0;
  font-size: 11px;
}
#link_1,
#link_2
{
  margin: 30px 0 10px 0;
  font-size: 19px;
  color: #1f3a5f;
}
/***********************************************************************/
/* identity anonymity work レスポンシブ                                  */
/***********************************************************************/
#identity,
#anonymity,
#workTitle
{
  margin: 0 0 30px 0;
  font-size: 23px;
}
#identity span,
#anonymity span,
#workTitle span
{
  display: block;
  margin: 4px 0 0 0;
  font-size: 11px;
}
/* PC用ギャラリーをスマホでは非表示 */
.galleryPC
{
  display: none;
}
/* anonymity用・PCのメイン画像をスマホでは非表示 */
.anonymityMainPC,
.workMainPC
{
  display: none !important;
}

/***********************************************************************/
/* work レスポンシブ                                                     */
/***********************************************************************/
/* PC用メイン画像をスマホでは非表示 */
.workGallerySP
{
  display: block;
}
}