@charset "UTF-8";

body          {margin:0;
               font-family:'メイリオ',
               'Hiragino Kaku Gothic Pro', sans-serif}


/* サイト名 */

.site h1 a    {color:#000000;
               text-decoration:none}

.site h1      {margin:0;
               font-size:30px}

.site img     {border:none}


/* ナビゲーション */

.menu ul      {margin:0;
               padding:0;
               margin-top:10px;
               list-style:none}

.menu li a    {display:block;
               padding:10px 15px;
               color:#000000;
               font-size:17px;
               text-decoration:none}

.menu li a:hover {background-color:#eeeeee}

.menu ul:after  {content:"";
                 display:block;
                 clear:both}

.menu li      {float:left;
               width:auto}


/* ヘッダー画像 */

.topimg        {max-width:100%;
                height:auto;
                vertical-align:bottom}

.box3          {border:solid 1px #aaaaaa;}


/* キャッチコピー */

.catch         {margin:0;
                padding:1px;
                color:#ffffff;
                font-size:20px;
                font-weight:700;}


/* ヘッダー画像にキャッチコピーを重ねる */

.top           {position:relative}

.catch         {position:absolute;
                bottom:0%;
                left:1%}


/* 概要 */

.gaiyou h1     {margin-top:0;
                margin-bottom:0;
                padding-top:5px;
                padding-bottom:5px;
                font-size:20px;
                font-weight:700;}

.gaiyou p      {margin-top:0;
                margin-bottom:0;
                padding-top:15px;
                padding-bottom:15px;
                background-color:#524e3c;
                font-size:16px;
                border-radius:0px 0px 10px 10px}

.gaiyou a     {display:block;
               background-color:#222222;
               color:#ffffff;
               text-align:center;
               text-decoration:none;
               border-radius:10px;
               box-shadow:5px 5px 5px #aaaaaa}

.gaiyou a:hover {opacity:0.8}

.gaiyou i     {display:block;
               padding-top:20px;
               padding-bottom:15px;
               font-size:20px;
               border-radius:10px 10px 0px 0px}

.gaiyou .fa-cogs {background-color:#bdb76b;
                  color:#808000;}

.gaiyou .fa-flag {background-color:#deb887;
                  color:#cd853f;}

.gaiyou .fa-shopping-bag {background-color:#add8e6;
                          color:#4682b4;}


/* お知らせ */

.news         {padding:15px;
               border:solid 5px #dddddd;
               border-radius:10px;
               box-shadow:5px 5px 5px #a9a9a9}

.news h1      {margin-top:0;
               margin-bottom:5px;
               font-size:20px;
               font-weight:700;
               color:#696969}

.news ul      {margin:0;
               padding:0;
               list-style:none}

.news li a    {display:block;
               padding:5px;
               border-bottom:dotted 2px #dddddd;
               color:#000000;
               font-size:17px;
               text-decoration:none}

.news li a:hover {background-color:#eeeeee}

.news a:after  {content:"";
                display:block;
                clear:both}

.news time     {float:left;
                width:60px;
                color:#888888;
                font-weight:bold}

.news .text     {float:none;
                 width:auto;
                 margin-left:70px}


/* 特許・実用新案,商標,意匠,知財相談,事務所紹介 */

.kiji h1     {margin-top:0;
              margin-bottom:20px;
              padding-left:20px;
              font-size:32px;
              font-weight:400;}

.kiji h2     {margin-top:0;
              margin-bottom:20px;
              border-bottom:solid 1px #dddddd;
              font-size:28px;
              font-weight:400;}

.kiji h2 i   {margin-right:5px;}

.kiji p      {max-width:640px;
              margin-top:0;
              margin-bottom:20px;}

.kiji .lead  {font-size:20px;
              color:#696969;}

.kijiimg     {max-width:100%;
              height:auto;
              margin-bottom:20px;}

.kiji .tokkyo      {border-left:solid 20px #bdb76b;}
.kiji .fa-cogs     {color:#808000;}

.kiji .syouhyou    {border-left:solid 20px #deb887;}
.kiji .fa-flag     {color:#cd853f;}

.kiji .isyou            {border-left:solid 20px #add8e6;}
.kiji .fa-shopping-bag  {color:#4682b4;}

.kiji .tizai         {border-left:solid 20px #f08080;}
.kiji .fa-comments   {color:#b22222;}

.kiji .intro         {border-left:solid 20px #8b0000;}
.kiji .fa-graduation-cap   {color:#8b0000;}
.kiji .fa-hand-o-right     {color:#8b0000;}
.kiji .fa-star             {color:#8b0000;}

.kiji .toiawase      {border-left:solid 20px #228b22;}
.kiji .fa-envelope   {color:#006400;}

.kiji h3             {font-weight:400;}
.kiji table          {margin-bottom:10px;}
.kiji th,td          {padding: 0px 10px 5px 5px;}
.kiji th             {text-align:left;
                      width:130px;
                      font-weight:400;
                      color:#696969;}


/* パンくずリスト */

.bread         {margin-bottom:20px;}

.bread ol      {margin:0;
                padding:0;
                list-style:none}

.bread li a    {display:inine-block;
                padding:0px;
                color:#000000;
                font-size:14px;
                text-decoration:none}

.bread li a:hover {background-color:#eeeeee}

.bread ol:after  {content:"";
                  display:block;
                  clear:both}

.bread li      {float:left;
                width:auto}

.bread li:after {content:'\003e';
                 margin-left:10px;
                 margin-right:10px;
                 color:#888888}


/* サイドメニュー */

.sidemenu      {border:solid 4px #dddddd;
                border-radius:5px;
                box-shadow:5px 5px 5px #aaaaaa}

.sidemenu h1   {margin:0;
                padding:10px;
                font-size:16px;
                font-weight:400;}

.sidemenu h1 i {margin-right:5px;
                color:#8abc6a;
                font-size:Larger;}

.sidemenu ul   {margin:0;
                padding:0;
                list-style:none;}

.sidemenu li a {display:block;
                padding:10px;
                border-top:solid 1px #dddddd;
                color:#000000;
                font-size:16px;
                text-decoration:none;}

.sidemenu li a:hover  {background-color:#eeeeee}


/* アドレス */

.address      {border:solid 4px #dddddd;
               border-radius:5px;
               box-shadow:5px 5px 5px #aaaaaa}

.address h1   {margin:0;
               padding:15px 0px 0px 7px;
               font-size:16px;
               font-weight:700;}

.address h1 i {margin-right:5px;
               color:#cd853f;
               font-size:Larger;}

.address h2 {margin:0;
             padding:5px 5px 10px 7px;
             border-bottom:solid 1px #dddddd;
             color:#000000;
             font-size:16px;
             font-weight:400;}

.address h3 {margin:0;
             padding:5px 5px 10px 7px;
             color:#000000;
             font-size:16px;
             font-weight:400;}


/* 入力フォーム */

input, textarea   {display:block;
                   border:solid 1px;
                   border-radius:3px;
                   font-size:18px;}

input             {width:300px;}

textarea          {width:600px;
                   height:120px;}

input[type="submit"] {width:100px;}


/* コピーライト */

.copyright p   {margin:0;
                color:#666666;
                font-size:16px;}


/* BOXAの下に罫線を挿入(コンテンツページのみ) */
.contents .boxA   {border-bottom:solid 1px #dddddd}


/* BOX5をバーの形にする */

.box5          {padding-top:10px;
                padding-bottom:10px;
                background-color:#dddddd}


/* ボックスの左右 */

.boxA,.box4,.box5,.box6,.box7
               {padding-left:15px;
                padding-right:15px;}


/* ボックスの上下 */

.boxA          {padding-top:20px;
                padding-bottom:10px;}

.box4          {padding-top:20px;
                padding-bottom:20px;}

.box4-1        {padding-bottom:10px}

.box6          {padding-top:20px}

.box6-1,.box6-2,.box6-3 {padding-bottom:10px}

.box7          {padding-top:25px;
                padding-bottom:25px;}




/* ################# 599px以下 ################### */

@media(max-width:599px){


/* ナビゲーション */

.menu li a    {padding:10px 7px;
               font-size:11px;}


/* キャッチコピー */

.catch         {padding:5px 10px;
                font-size:12px}


/* 特許・実用新案,商標,意匠,知財相談 */

.kiji h1     {font-size:28px}

.kiji h2     {font-size:20px}

.kiji .lead  {font-size:16px}

.kiji th     {width:65px;}


/* 入力フォーム */

input, textarea   {display:block;
                   border:solid 1px;
                   border-radius:3px;
                   font-size:16px;}

input             {width:240px;}

textarea          {width:240px;
                   height:150px;}

}


/* ################# 768px以上 ################# */

@media(min-width:768px){


/* BOX1とBOX2を横に並べる設定 */

.boxA:after   {content:"";
               display:block;
               clear:both}

.box1         {float:left;
               width:auto}

.box2         {float:right;
               width:auto}


/* BOX4-1とBOX4-2を横に並べる設定 */

.box4:after   {content:"";
               display:block;
               clear:both}

.box4-1       {float:left;
               width:100%;
               margin-right:-140px;
               padding-right:160px;
               -moz-box-sizing:border-box;
               -webkit-box-sizing:border-box;
               box-sizing:border-box}

.box4-2       {float:left;
               padding-top:20px;
               width:140px;}


/* BOX6-1,BOX6-2,BOX6-3を横に並べる設定 */

.box6:after   {content:"";
               display:block;
               clear:both}

.box6-1        {float:left;
               width:32%;
               margin-right:2%}

.box6-2        {float:left;
               width:32%;
               margin-right:2%}

.box6-3        {float:left;
               width:32%}


/* BOX7-1とBOX7-2を横に並べる設定 */

.box7:after    {content:"";
                display:block;
                clear:both}

.box7-1        {float:right;
                width:77%;
                padding-left:35px;
                -moz-box-sizing:border-box;
                -webkit-box-sizing:border-box;
                box-sizing:border-box;}

.box7-2        {float:left;
                width:23%;}


/* 写真 */

.sidemenu .photo  {margin-left:15%;
                   width:70%;
                   height:auto;}

}


/* ################## 1190px以上 #################### */

@media(min-width:1190px){


/* 全体の横幅を固定 */
.box3,.box4,.boxA-inner,.box5-inner,.box6,.box7
              {width:1140px;
               margin-left:auto;
               margin-right:auto}


/* BOXAの下に罫線を挿入 */
.boxA         {margin-bottom:20px;
               border-bottom:solid 1px #dddddd}

}