app/template/default/Block/content_left_img3.twig line 1

Open in your IDE?
  1. <style>
  2. /*全てに適用*/    
  3.     .donyu{
  4.     background-color: #439acf;
  5.     padding: 2% 2%;    
  6.     margin: 0 1%;
  7.     }
  8.     .l_item_btn4{
  9.     display: block;
  10.     /*width: 40%;*/
  11.     text-align: center;
  12.     margin: 10px 0 0  0;
  13.     padding: 5px 0;
  14.     -webkit-border-radius: 20px;
  15.     -moz-border-radius: 20px;
  16.     border-radius: 20px;
  17.     border: 1px solid #FFF;
  18.     position: relative;
  19.     top: 36px;
  20.     }
  21.     
  22.     
  23.     .d_item_title2{
  24.     font-size: 30px;
  25.     padding-bottom: 5px;
  26.     margin-bottom: 20px;
  27.     color: #FFF;
  28.     text-align: left;
  29.     }
  30.     .donyu_txt{
  31.         font-size: 18px;
  32.         color: #FFF;
  33.     }
  34.     
  35.     
  36. /*ウィンドウ幅が767px以上の場合に適用*/
  37. @media screen and (min-width: 767px) { 
  38.     }
  39.     
  40. /*ウィンドウ幅が最大767pxまでの場合に適用*/
  41. @media screen and (max-width: 767px) { 
  42.     .donyu{
  43.         background-color: #439acf;
  44.         padding: 5% 3%;    
  45.         margin: 0 5%;
  46.     }
  47.     .l_item_btn4{
  48.     display: block;
  49.     width: 100%;
  50.     text-align: center;
  51.     margin: 10px 0 0  0;
  52.     padding: 10px 0;
  53.     -webkit-border-radius: 20px;
  54.     -moz-border-radius: 20px;
  55.     border-radius: 20px;
  56.     border: 1px solid #FFF;
  57.     position: relative;
  58.     top: 36px;
  59.     }
  60.     .d_item_title2{
  61.     font-size: 24px;
  62.     padding-bottom: 5px;
  63.     margin: 20px;
  64.     color: #FFF;
  65.     text-align: center;
  66.     }
  67.     .donyu_txt{
  68.         font-size: 20px;
  69.         color: #FFF;
  70.         margin: 0 15px;
  71.     }
  72.     .t_flexBox{
  73.         display: block;
  74.     }
  75.     
  76. }
  78. </style>        
  79.       <div class="donyu">
  80.           
  81.         <div class="img_left">
  82.           <img src="/html/user_data/img/img5.jpg" alt="" class="img_width">
  83.         </div>
  84.             <h2 class="d_item_title2" style="">導入事例</h2>
  85.         <div class="txt t_flexBox">
  86.           <div>
  87.             <p class="donyu_txt">マルチピュアを選ぶ理由</p>
  88.             <a href="https://multipure.co.jp/case/" class="l_item_btn4" style="color: #FFF;" target="_blank">詳しくはこちら</a>
  89.             {#<a href="https://multipure.co.jp/case/" class="l_item_btn" style="color: #FFF;" target="_blank">詳しくはこちら</a>#}
  90.           </div>
  91.         </div>
  92.           <br style="clear: both;">
  93.       </div>